美文网首页
一个简易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