美文网首页
实现一个jQuery的API

实现一个jQuery的API

作者: 晓景_49fa | 来源:发表于2019-06-17 10:43 被阅读0次

    window.jQuery = jQuery('div')

    window.$ = jQuery

    var $div = $('div')

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

    $div.setText('hi') // 可将所有 div 的 textContent 变为 hi

    window.jQuery = function(nodeOrSelector){

        let nodes = {}

        if(typeof nodeOrSelector === 'string'){

          let temp =  document.querySelector(nodeOrSelector)//伪数组

          for(lei i = 0; i< temp.clientHeight; i++){

              nodes[i] = temp[i]

          }

          nodes.length = temp.length

        }elseif(nodeOrSelector instanceof Node ){

            nodes = {

                0: nodeOrSelector,

                length: 1

            } 

        }

        nodes.getSiblings = function(){

        }

        nodes.addClass = function(classes){

            classes.forEache((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 的 class 添加一个 red

    $div.setText('hi') // 可将所有 div 的 textContent 变为 hi

    相关文章

      网友评论

          本文标题:实现一个jQuery的API

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