您好,登錄后才能下訂單哦!
小編這次要給大家分享的是如何使用jQuery選擇器,文章內容豐富,感興趣的小伙伴可以來了解一下,希望大家閱讀完這篇文章之后能夠有所收獲。
jQuery 選擇器 (prev + next)
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">Welcome</span> <span id="n4">Hello</span> </p> <p id="n5" class="detail"> <span id="n6" class="b codeplayer">To <span id="n7" class="a">w3cschool.cn</span> <span id="n8"></span> <span id="n9"></span> </span> </p> </div>
/* jQuery代碼 */ <script> // 擴展jQuery對象,添加showTagInfo()方法 // 用于將jQuery對象所有匹配元素的標識信息追加到body元素內 // 每個元素的標識信息形如:"tagName"或"tagName#id" jQuery.fn.showTagInfo = function(){ var tags = this.map( function(){ return this.tagName + ( this.id ? "#" + this.id : "" ); } ).get(); $("body").append( tags.join("<br>") + "<br><br>" ); }; // 選擇了id為n5的一個元素 $("p + p").showTagInfo(); // 選擇了id分別為n4、n8、n9的三個元素 // n4是n3的next,n8是n7的next,n9是n8的next $("span + span").showTagInfo(); // 選擇了id分別為n4、n8的兩個元素 // n8沒有包含類名a,因此無法匹配其next——n9 $("span.a + span").showTagInfo(); // 返回一個空的jQuery對象 // HTML中雖然有span標簽,但不是p標簽的同輩元素,而是其子代或后代 $("p + span").showTagInfo(); </script>
看完這篇關于如何使用jQuery選擇器的文章,如果覺得文章內容寫得不錯的話,可以把它分享出去給更多人看到。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。