详解jquery选择器的原理

2019-11-19 15:55:47

字体：大中小

来源：转载

供稿：网友

详解jquery选择器的原理

html部分

<!doctype html> <html lang="en"> <head>   <meta charset="UTF-8" />   <title>Document</title>   <script src="js/minijquery.js"></script> </head> <body>   <div class="one">1</div>   <div class="two">2</div> </body> <script>   var result = $("div");   console.log(result);   alert($('div').size()); </script> </html> js

js部分

(function(){   //暴露外部的引用   var jQuery = window.jQuery = window.$ = function(selector){     return new jQuery.fn.init(selector);   }      //添加原型事件   jQuery.fn = jQuery.prototype = {     //     init:function(selector){       var element = document.getElementsByTagName(selector);       Array.prototype.push.apply(this,element);       return this;     },     myjQuery:"the test one",     length:0,     size:function(){       return this.length;     }   }      //将init的原型引用成jQuery的原型   jQuery.fn.init.prototype = jQuery.fn;    })();

我用我的理解解释一下，就是jquery原型里面有一个init初始化的方法，将传入的值进行解析，比如传入的id还是class还是标签名。然后通过相应的方法返回数组型对象。既可以通过对象直接调用方法，也可以使用数组的length。

以上就是jQuery 原理的分析，如有疑问请留言或者到本站社区交流讨论，感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

上一篇：谈谈对vue响应式数据更新的误解

下一篇：浅谈node中的exports与module.exports的关系