jQuery的prev + next選擇器用於匹配緊接在prev元素後面的同儕next元素,將其封裝為jQuery對象並返回。
注意:選擇器next的查找範圍必須是與"prev元素"相鄰的下一個元素,並且必須是"prev元素"的同輩元素。
語法
// 这里的prev表示具体的选择器 // 这里的next表示具体的选择器 jQuery( "prev + next" )
+號兩側的空格可以省略,但不建議省略,否則字元過於緊密可能影響閱讀。
參數
參數 說明
prev 一個有效的選擇器。
next 一個有效的選擇器。
傳回值
傳回封裝了與"prev元素"緊鄰的下一個同儕元素中、符合選擇器next的DOM元素的jQuery物件。
雖然與一個"prev元素"緊鄰的下一個同輩元素最多只有一個,但是"prev元素"可以有多個,因此匹配到的DOM元素也可以有多個,並且都被封裝在在傳回的jQuery物件中。
如果找不到任何相應的匹配,則傳回一個空的jQuery物件。
範例&說明
以下面這段HTML程式碼為例:
<div id="n1"> <p id="n2" class="test"> <span id="n3" class="a">Hello</span> <span id="n4">Hello</span> </p> <p id="n5" class="detail"> <span id="n6" class="b codeplayer">World <span id="n7" class="a">http://365mini.com</span> <span id="n8"></span> <span id="n9"></span> </span> </p> </div>
現在,我們想要找出與p標籤相鄰的下一個同儕p標籤,則可以編寫如下jQuery代碼:
// 选择了id为n5的一个元素 $("p + p");
接著,我們查找與span標籤相鄰的下一個同輩span標籤,則可以編寫如下jQuery代碼:
// 选择了id分别为n4、n8、n9的三个元素 // n4是n3的next,n8是n7的next,n9是n8的next $("span + span");
查找與包含類名a的span標籤相鄰的下一個同儕span標籤,對應的jQuery程式碼如下:
// 选择了id分别为n4、n8的两个元素 // n8没有包含类名a,因此无法匹配其next——n9 $("span.a + span");
找出與p標籤相鄰的下一個同儕span標籤,對應的jQuery程式碼如下:
// 返回一个空的jQuery对象 // HTML中虽然有span标签,但不是p标签的同辈元素,而是其子代或后代 $("p + span");
以上是對jQuery中prev + next選擇器的基本介紹及用法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!