詳解jquery選擇器的原理

來源：懂視網責編：小采時間：2020-11-27 22:33:39

詳解jquery選擇器的原理

詳解jquery選擇器的原理:詳解jquery選擇器的原理 html部分 <!doctype html> <html lang=en> <head> <meta charset=UTF-8 /> <title>Document</title> <script src=js/minijqu

推薦度：

點擊下載本文 文檔為doc格式

導讀詳解jquery選擇器的原理:詳解jquery選擇器的原理 html部分 <!doctype html> <html lang=en> <head> <meta charset=UTF-8 /> <title>Document</title> <script src=js/minijqu

詳解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。

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com