美文网首页
一个简易jQuery的API

一个简易jQuery的API

作者: December1224 | 来源:发表于2019-05-09 13:51 被阅读0次
    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。

    相关文章

      网友评论

          本文标题:一个简易jQuery的API

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