jQuery dom元素層級匹配選擇器簡單介紹

antzone發表於2017-03-31

在頁面中每一個dom元素都有其存在的位置。

我們可以通過與周邊dom元素的位置關係來獲取指定的dom元素。

jquery提供了實現這方面功能的選擇器,下面簡單的做一下介紹。

一.子元素選擇器:

此選擇器能夠查詢指定父元素下的所有一級子元素。

語法結構如下:

[JavaScript] 純文字檢視 複製程式碼
$("parent->chilid");

更多相關內容可以參閱jQuery parent>child一章節。

二.後代元素選擇器:

此選擇器能夠查詢指定父元素下所有的後臺元素,不只是一級子元素。

語法結構:

[JavaScript] 純文字檢視 複製程式碼
$("ancestor descendant");

更多相關內容可以參閱jQuery 後代選擇器一章節。

三.相鄰同輩元素選擇器:

此選擇器能夠查詢指定元素後面所有相鄰的元素。

語法結構:

[JavaScript] 純文字檢視 複製程式碼
$("prev~siblings")

更多相關內容可以參閱jQuery prev ~ siblings一章節。

四.緊鄰同輩元素選擇器:

此選擇器能夠匹配緊鄰在prev元素後的next元素。

語法結構:

[JavaScript] 純文字檢視 複製程式碼
$("prev + next")

更多相關內容可以參閱jQuery prev + next一章節。

相關文章