ホームページ  >  記事  >  ウェブフロントエンド  >  JQueryの前と次のセレクター

JQueryの前と次のセレクター

巴扎黑
巴扎黑オリジナル
2017-06-22 10:17:493853ブラウズ


1 はじめに

prev + next セレクターは、prev 要素の直後にあるすべての next 要素と一致するために使用されます。このうち、prev と next は同レベルの要素です。

prev + next セレクターは次のように使用されます:

$("prev + next");

prev は任意の有効なセレクターを指します。

next は、prev セレクターの直後にある有効なセレクターです。

たとえば、e388a4556c0f65e1904146cc1a846bee タグの後の a1f02c36ba31691bcfe87b2722de723b タグを一致させるには、次の jQuery コードを使用できます。 17bc257102169cbee8e20a03c884d3e6 タグを変更し、一致する要素の背景色を水色に変更します。

3つのコード

<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

4つの実行結果


5 操作手順

段落「first p」と「next p」には背景が追加されていますが、「p の外側の p」は label 要素の兄弟要素ではないため、背景が追加されていないことを確認してください。

以上がJQueryの前と次のセレクターの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。