一个jQuery面试题

作者: _William_Zhang | 来源:发表于2018-07-28 01:17 被阅读38次

    补全下面的代码

    window.jQuery = ???
    window.$ = jQuery
    
    var $div = $('div')
    $div.addClass('red') // 可将所有 div 的 class 添加一个 red
    $div.setText('hi') // 可将所有 div 的 textContent 变为 hi
    

    补全代码后:

    window.jQuery = function(nodeOrSelector){
    let nodes = {}
    
    if(typeof nodeOrSelector === 'string'){
        let temp = document.querySelectorAll(nodeOrSelector) //伪数组
        for(let i = 0 ;i <temp.length; i++){
            nodes[i] = temp[i]
        }
        nodes.length = temp.length
    }else if (nodeOrSelector instanceof Node){
       nodes = {0:nodeOrSelector,length:1} //伪数组
    } 
    
    // 设置所有 div 的 textContent 
    nodes.setText = function(text){
      for(let i = 0;i<nodes.length; i++){
        nodes[i].textContent =  text
      }
    
    // 为所有 div 添加 class
    nodes.addClass = function(text){
       for(let i = 0;i<nodes.length;i++){
        nodes[i].classList.add(text)
      } 
    }
      return nodes
    } 
    
    window.$ = jQuery
    var $div = $('div')
    $div.addClass('red') // 可将所有 div 的 class 添加一个 red
    $div.setText('hi') // 可将所有 div 的 textContent 变为 hi
    

    思路:
    1.题目中的代码缺失具体的函数,因此 window.jQuery = ??? ,问号处???应该是一个函数.

    2.函数中应该有 addClass 方法 和 setText 方法.

    3.函数应该返回一个 hash ,所以先声明一个 空对象。let nodes = {}.
    4.用伪数组存放获取的所有 div.

    相关文章

      网友评论

        本文标题:一个jQuery面试题

        本文链接:https://www.haomeiwen.com/subject/vjpnmftx.html