实现API

1.实现JQuery的API选择器

对于节点和选择器的参数都可返回所需要的伪数组对象的index-value以及length-value的hash

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
    }
  }

2.实现JQuery的API函数对象的方法

nodes.addClass = function(classes){
        [classes].forEach( (value) => {
        for (let i = 0;i < nodes.length;i++) {
        nodes[i].classList.add(value)
        }
      })
  }
  
  nodes.setText = function(text){
    for(let i=0;i<nodes.length;i++){
      nodes[i].textContent = text
    }
  }
  return nodes
}

3.返回JQuery对象

4.JQuery的API使用

对于window.JQuery的调用,使用$的标志服命名JQuery对象

window.$ = jQuery

var $div = $('div')//声明对应的jQuery对象
$div.addClass('red')//可将所有 div 的 class 添加一个 red
$div.setText('hi')// 可将所有 div 的 textContent 变为 hi

猜你喜欢

转载自blog.csdn.net/weixin_43294966/article/details/85095555
今日推荐