在很多場景下,需要根據一個已知的jquery對象,去查找其滿足條件的后代節點。
這時可以利用 find函數和children來處理。
find和children函數都可有一個參數,常見的是一個字符串,其值就是選擇器,含義同利用 $()函數來獲取元素。
兩者的區別是children函數只獲取其滿足條件的第一層子節點,而find函數則獲取所有下級子節點。
下面我們舉例說明:
<div id="mydiv"> <p id="pid"></p> <span class="aspan">hello</span> <div> <a id="aid"></a> <span class="aspan">test</span> </div> </div> js代碼如下: var obj = $("#mydiv"); //獲取到obj元素下的 div標簽下的樣式為aspan下的元素 var child = obj.find("div .aspan"); alert(child.html()); children方法 obj.children() 獲取obj的第一層所有子節點 obj.children("span") 獲取obj的第一層所有標簽為span子節點 obj.children("a") 返回為空,因為a標簽不是obj的直接子節點,這時應該用find方法
通過children方法獲得是一個jquery對象,利用 get(index)和 [index]取得的是dom對象,可以利用 first方法獲取其中包含的第一個dom對象對應的jquery對象。
可以看出,使用這兩個函數,核心就是其輸入參數,即編寫相應的選擇器.
注意,利用find方法,如果條件不存在沒有匹配的元素,則返回的並非是null或undefined,可以通過 length屬性為0是否匹配到。