一个简易jQuery的API

2019-05-09  本文已影响0人  December1224
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 }
    } 
     nodes.addClass = function(classes) {
         classes.forEach((value) => {
             for(let i = 0; i<nodes.length; i++){nodes[i].classList.add(value)}
         } )
     }
     nodes.text = function(text) {
         if (text === undefined){
             var texts = []
             for (let i = 0 ;i< nodes.length; i++){
                 texts.push(nodes[i].textContent)
             }
             return texts
         }else{
            for(let i = 0; i<nodes.length; i++){
             nodes[i].textContent = text
             }
         }
     }
     return nodes
}

window.$ = jQuery
var $div = $('div')
$div.addClass('red') 
$div.text('hi')  

$div.addClass('red') :可将所有div的class添加一个 red;

$div.text('hi') :可将所有div的text变为 hi,对于jQuery来说,无论是设置还是获取都可以用text。

上一篇 下一篇

猜你喜欢

热点阅读