JQuery的prev + next選擇器

一 介紹

#prev + next選擇器用來符合所有緊接在prev元素後的next元素。其中，prev和next是兩個相同等級的元素。

prev + next選擇器的使用方法如下： 

$("prev + next");

prev是指任何有效的選擇器。

next是一個有效選擇器並緊接著prev選擇器。

例如，要符合e388a4556c0f65e1904146cc1a846bee標記後的a1f02c36ba31691bcfe87b2722de723b標記，可以使用下面的jQuery程式碼：

$("p + img") ;

 

二應用

篩選緊接在17bc257102169cbee8e20a03c884d3e6標記後的e388a4556c0f65e1904146cc1a846bee標記並改變匹配元素的背景顏色為淡藍色。

 

三碼

#

<script language="javascript" src="JS/jquery-3.1.1.min.js"></script>
<style type="text/css">
	.background{background:#cef}
	body{font-size:12px;}
</style>
<p>
    <label>第一个label</label>
    <p>第一个p</p>
    <fieldset>
        <label>第二个label</label>
        <p>第二个p</p>
    </fieldset>
</p>
<p>p外面的p</p>
<script type="text/javascript" charset="GBK">
      $(document).ready(function() {
            $("label+p").addClass("background"); //为匹配的元素添加CSS类
});
</script

 

 

############## #四運行結果################## ###### #########五運行說明###################################################

看到「第一個p」和「第二個p」的段落被加入了背景，而「p外面的p」由於不是label元素的同級元素，所以沒有被加入背景。

以上是JQuery的prev + next選擇器的詳細內容。更多資訊請關注PHP中文網其他相關文章！