Home  >  Article  >  Web Front-end  >  Introduction to jQuery even selector (:even)

Introduction to jQuery even selector (:even)

黄舟
黄舟Original
2017-06-23 09:29:414736browse

jQuery's :even selector is used to match all elements whose index value is an even number, encapsulate them into jQuery objects and return them.

The opposite of this selector is the :odd selector, which is used to match all elements with odd index values.

Note: Since index values ​​start counting from 0, elements with even indexes are actually elements with an odd natural order.

Overview

Matches all elements with an even index value, counting from 0

Example

Description:

FindRows 1, 3, 5... of table (i.e. index values ​​0, 2, 4...)

HTML code:

<table> 
<tr>
<td>Header 1</td>
</tr> 
<tr>
<td>Value 1</td>
</tr> 
<tr>
<td>Value 2</td>
</tr> 
</table>

jQuery code:

$("tr:even")

Result:

[ <tr><td>Header 1</td></tr>, <tr><td>Value 2</td></tr> ]

Return value

Returns a jQuery object that encapsulates the DOM element with an even index value among the DOM elements matching the selector selector.

If there is no element matching the selector selector, an empty jQuery object is returned.

Take the following HTML code as an example:

<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>

Now, if we want to find div tags whose natural order is odd (index value is even), we can write the following jQuery code:

// 选择了id分别为n1、n7的两个元素
$("div:even");

Next, to find all odd rows in the table (index values ​​are even), you can write the following jQuery code:

// 选择了id分别为n9、n11的两个元素
$("tr:even");

Result:

Introduction to jQuery even selector (:even)

The above is the detailed content of Introduction to jQuery even selector (:even). For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article:What is ECMAScript6?Next article:What is ECMAScript6?