jQuery原始碼之init部分

2021-09-27 12:05:43 字數 2207 閱讀 6614

jquery 的入口函式jquery.fn.init。(jquery.prototype.init

$()常用的選擇器介面:

$()空引數,這個會直接返回乙個空的 jquery 物件,即:

物件:

$(this) $(document)把傳入的物件包裝成jquery物件

函式

$(function(){})dom文件載入完成後,載入執行的。等效於dom載入完畢後執行了 $(document).ready方法。

傳入字串:

查詢dom節點

建立dom節點

if ( !selector ) 

if ( typeof selector === "string" ) else if ( selector.nodetype ) else if ( isfunction( selector ) )

jquery針對字串部分又做了區分:

merge: function( first, second ) 

first.length = i;

return first;

},

if ( selector[ 0 ] === "

selector[ selector.length - 1 ] === ">" &&

selector.length >= 3 ) else

//其中:rquickexpr = /^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,

針對查詢dom節點:match = rquickexpr.exec( selector );根據match判斷為id選擇器,類選擇器或者標籤選擇器

jquery.find = sizzle;

function sizzle(selector, context, results, seed)

// try to shortcut find operations (as opposed to filters) in html documents

if (!seed)

context = context || document;

// true

if (documentishtml) else if (match[2]) else if ((m = match[3]) && support.getelementsbyclassname && context.getelementsbyclassname) }}

} return select(selector.replace(rtrim, "$1"), context, results, seed);

}

另外提一句:如果傳入函式:

// handle: $(function)

// shortcut for document ready

} else if ( isfunction( selector ) )

root = root || rootjquery;

rootjquery = jquery( document );

所以:$(function(){})dom文件載入完成後,載入執行的。等效於dom載入完畢後執行了 $(document).ready方法。

如何建立dom元素呢?

jquery.merge( this, jquery.parsehtml(selector,context))使用到了merge方法:

this是乙個$()物件,第二個引數是乙個陣列(建立的dom節點)

由於$().length=0,

merge: function( first, second ) 

first.length = i;

return first;

},

所以二者是可以merge的。

jQuery原始碼解讀之init函式

直接new了乙個物件。同時根據jquery.fn jquery.prototype,jquery.fn相當於jquery.prototype。jquery function selector,context init jquery.fn.init function selector,context,...

jQuery原始碼閱讀2 init

總架構圖 摘自 jquery技術內幕 逐步分析 init負責解析引數selector和context的型別 selector和context共有12個分支 function init selector context rootjquery 判斷傳入的引數是否是dom節點 if selector.no...

Vue CLI 3 原始碼系列之init

用慣老版本 vue cli 的同學一般多會選擇使用如下命令來建立模板專案 vue init webpack demo因為使用了同樣乙個vue命令,所以之前的會被覆蓋,如果還需要使用,需要自行安裝 npm install g vue cli init我們先看一下,如果本地已經安裝了最新版本的 vue ...