jQuery選擇器源碼解讀(七):elementMatcher函數(shù)
要讀懂Sizzle的Compile執(zhí)行過程,首先需要弄清楚涉及的各個子程序的功能和關(guān)鍵變量和作用,我將逐一對jQuery-1.10.2版本的Compile代碼進(jìn)行說明,望能給予大家?guī)椭?/p>
elementMatcher(matchers)
1、源碼
function elementMatcher(matchers) {
return matchers.length > 1 ? function(elem, context, xml) {
var i = matchers.length;
while (i--) {
if (!matchers[i](elem, context, xml)) {
return false;
}
}
return true;
} : matchers[0];
}
2、功能
該函數(shù)返回一個函數(shù),用來判定傳入的elem是否符合匹配執(zhí)行函數(shù)數(shù)組matchers,若不滿足返回false,否則返回true。
若matchers僅有一個元素,則返回該元素本身,否則返回一個新函數(shù)——即代碼中的function(elem, context, xml)函數(shù)。
返回函數(shù)效果有點(diǎn)類似于context.filter(selectors),當(dāng)然,其結(jié)果僅僅返回true或false,而非jQuery對象。
3、參數(shù)
matchers——數(shù)組,每個元素都是非偽類的匹配器執(zhí)行函數(shù)。例如:在實(shí)際執(zhí)行過程中,div.map span:lt(10),其中div和,map的匹配執(zhí)行函數(shù)就會作為matchers的兩個元素傳入elementMatcher函數(shù)來過濾span節(jié)點(diǎn)的父節(jié)點(diǎn)是否滿足要求。
4、返回函數(shù)
4.1 若matchers多于1個元素,則返回如下函數(shù):
function(elem, context, xml) {
var i = matchers.length;
while (i--) {
if (!matchers[i](elem, context, xml)) {
return false;
}
}
return true;
}
4.1.1 功能
從matchers最后一個元素到第一個元素依次調(diào)用,以匹配傳入的elem節(jié)點(diǎn)是否滿足要求,全部滿足返回true,否則返回false。
4.1.2 參數(shù)
elem——待檢查的單個節(jié)點(diǎn)元素。
context——執(zhí)行整個選擇器字符串匹配的上下文節(jié)點(diǎn),大部分時候是沒有用途。
xml——當(dāng)前搜索對象是HTML還是XML文檔,若是HTML,則xml參數(shù)為false。
4.2 若matchers只有1個元素,則返回該元素本身。
4.2.1 功能
檢查傳入的elem是否與選擇器匹配,若匹配返回true,否則返回false。
4.2.2 參數(shù)
同4.1.2參數(shù)說明。
- 詳解element-ui日期時間選擇器的日期格式化問題
- 詳解關(guān)于element級聯(lián)選擇器數(shù)據(jù)回顯問題
- element-ui 時間選擇器限制范圍的實(shí)現(xiàn)(隨動)
- Element UI框架中巧用樹選擇器的實(shí)現(xiàn)
- vue2.0 element-ui中el-select選擇器無法顯示選中的內(nèi)容(解決方法)
- Vue Element 分組+多選+可搜索Select選擇器實(shí)現(xiàn)示例
- jQuery中元素選擇器(element)簡單用法示例
- jQuery中element選擇器用法實(shí)例
- jQuery 屬性選擇器element[herf*=''value'']使用示例
- 基于Element的組件改造的樹形選擇器(樹形下拉框)
相關(guān)文章
toggle一個div顯示或隱藏且可擴(kuò)展成自定義下拉框
本文為大家介紹下如何讓一個div顯示或隱藏且可擴(kuò)展成自定義下拉框,具體實(shí)現(xiàn)如下,感興趣的朋友可參考下,希望對大家有所幫助2013-09-09
基于jQuery實(shí)現(xiàn)左右圖片輪播(原理通用)
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)左右圖片輪播,實(shí)現(xiàn)原理通用可通用,希望能和大家分享一下思路,感興趣的小伙伴們可以參考一下2015-12-12
web前端開發(fā)JQuery常用實(shí)例代碼片段(50個)
本文給大家展示50個jquery代碼片段,這些代碼能夠給你的javascript項(xiàng)目提供幫助,需要的朋友快來學(xué)習(xí)一下吧2015-08-08
JQuery表格內(nèi)容過濾的實(shí)現(xiàn)方法
使用JQuery 實(shí)現(xiàn)一個表格內(nèi)容 過濾的功能,有需要的朋友可以參考一下,代碼如下:2013-07-07
使用jQuery全局事件ajaxStart為特定請求實(shí)現(xiàn)提示效果的代碼
首先,重寫Ajax方法的代價太高,仍然可以利用jQuery自身的Ajax Events。2010-12-12
用jquery實(shí)現(xiàn)輸入框獲取焦點(diǎn)消失文字
文本框中經(jīng)常會有提示你輸入的信息,當(dāng)你點(diǎn)擊文本框,提示信息自動消失,下面也為大家介紹下輸入框消失文字的方法,感興趣的朋友可以參考下2013-04-04
jQuery基于$.ajax設(shè)置移動端click超時處理方法
這篇文章主要介紹了jQuery基于$.ajax設(shè)置移動端click超時處理方法,分析了click事件與touchstart事件的原理與處理技巧,需要的朋友可以參考下2016-05-05

