ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery 偶数セレクター (:even) の紹介

jQuery 偶数セレクター (:even) の紹介

黄舟
リリース: 2017-06-23 09:29:41
オリジナル
4766 人が閲覧しました

jQueryの:evenセレクターは、index値が偶数であるすべての要素と一致し、それらをjQueryobjectsにカプセル化して返します。

このセレクターの反対は :odd セレクターで、奇数のインデックス値を持つすべての要素を照合するために使用されます。

注: インデックス値は 0 から数え始めるため、偶数のインデックスを持つ要素は、実際には奇数の自然順序を持つ要素です。

概要

は、0から数えて偶数のインデックス値を持つすべての要素と一致します

説明:

テーブル

行1、3、5...を検索します(つまり、インデックス値0、2 , 4 ...)

HTML コード:

<table> 
<tr>
<td>Header 1</td>
</tr> 
<tr>
<td>Value 1</td>
</tr> 
<tr>
<td>Value 2</td>
</tr> 
</table>
ログイン後にコピー

jQuery コード:

$("tr:even")
ログイン後にコピー

結果:

[ <tr><td>Header 1</td></tr>, <tr><td>Value 2</td></tr> ]
ログイン後にコピー

戻り値

セレクターに一致する DOM 要素のうち偶数のインデックス値を持つ DOM 要素をカプセル化する jQuery オブジェクトを返します。

セレクターに一致する要素がない場合は、空の jQuery オブジェクトが返されます。

次の HTML コードを例に挙げます。

<div id="n1">
    <div id="n2">
        <ul id="n3">
            <li id="n4">item1</li>
            <li id="n5">item2</li>
            <li id="n6">item3</li>
        </ul>
    </div>
    <div id="n7">
        <table id="n8">
            <tr id="n9"><td>cell1</td></tr>
            <tr id="n10"><td>cell2</td></tr>
            <tr id="n11"><td>cell3</td></tr>
        </table>
    </div>
</div>
ログイン後にコピー

ここで、自然順序が奇数 (インデックス値が偶数) である div タグを見つけたい場合は、次の jQuery コードを記述できます。

// 选择了id分别为n1、n7的两个元素
$("div:even");
ログイン後にコピー

次に、テーブル内の div タグ すべての奇数行 (インデックス値が偶数) については、次の jQuery コードを記述できます:

// 选择了id分别为n9、n11的两个元素
$("tr:even");
ログイン後にコピー

結果:

jQuery 偶数セレクター (:even) の紹介

🎜

以上がjQuery 偶数セレクター (:even) の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート