实现多节点操作的 jQuery API 教程

下面为一个操作多节点的jQuery API实现过程

window.jQuery = function(nodeOrSelector){
  let node
  if(typeof nodeOrSelector === 'string'){
    node =document.querySelector(nodeOrSelector)
  }else{
    node = nodeOrSelector
  }
  
  return{
    getSiblings:function(){
  var allChildren = node.parentNode.children
 
  var array = {length:0}
  for(let i = 0;i < allChildren.length; i++){
    if(allChildren[i] !== node){
     array[array.length] = allChildren[i] /*给没有push方法的数组传入数据*/
     array.length += 1
    }
  }
  return array
    },
    addClass:function(classes){
      classes.forEach( (value) => node.classList.add(value) )
    }
  }
}

当我拿到这段代码时，它只能实现单个节点的操作，并不能用来操作多个节点，下面我将把它修改下

window.jQuery = function(nodeOrSelector){
  let nodes = {}
    if(typeof nodeOrSelector === 'string'){
    let temp = document.querySelectorAll(nodeOrSelector)
    for(let i=0;ili')
console.log(node2)

上面的这段代码实现了判断一个传入的参数是字符串还是节点，我们还给它一个临时变量temp，且为了保持一致性所返回的结果都是纯净（没有nodeList）的伪数组。这样我们就实现了对多个节点的操作。

 nodes.addClass = function(classes){
   classes.forEach((value) =>{
     for(let i=0;i
再插入一段 为每个匹配的元素添加指定的样式类名 的addClass代码
nodes.getText = function(){
   var texts = []
   for(let i=0;i
再加入一段获取文本的功能，现在它能轻松获取到元素的文本。
但是我们只能获取文本，并不能设置文本，所以我们再添加一段设置文本的功能。
nodes.setText = function(text){
   for(let i=0;i
现在我们能设置文本了
先前的文本：
设置之后的文本：
完整的代码如下：
window.jQuery = function(nodeOrSelector){
  let nodes = {}
  /*传入参数判断是字符串还是节点*/
  if(typeof nodeOrSelector === 'string'){
    let temp = document.querySelectorAll(nodeOrSelector)
    for(let i=0;i{
     for(let i=0;ili')
node2.setText('hi')