如何获取第n个jQuery元素

时间：2022-11-28 08:40:46

In jQuery, $("...").get(3) returns the 3rd DOM element. What is the function to return the 3rd jQuery element?

在jQuery中，$(“…”).get(3)返回第三个DOM元素。返回第三个jQuery元素的函数是什么?

11 个解决方案

#1

262  

Why not browse the (short) selectors page first?

为什么不先浏览(短)选择器页面?

Here it is: the :eq() operator. It is used just like get(), but it returns the jQuery object.

这里是:eq()操作符。它就像get()一样使用，但是它返回jQuery对象。

Or you can use .eq() function too.

也可以使用.eq()函数。

#2

277  

You can use the :eq selector, for example:

您可以使用:eq选择器，例如:

$("td:eq(2)").css("color", "red"); // gets the third td element

Or the Traversing/eq function:

或遍历/ eq函数:

$("td").eq(2).css("color", "red");

Also, remember that the indexes are zero-based.

另外，请记住这些索引是基于零的。

#3

45  

if you have control over the query which builds the jQuery object, use :eq()

如果您控制了构建jQuery对象的查询，请使用:eq()

$("div:eq(2)")

If you don't have control over it (for example, it's being passed from another function or something), then use .eq()

如果您无法控制它(例如，它正在从另一个函数或其他函数传递)，那么使用.eq()

var $thirdElement = $jqObj.eq(2);

Or if you want a section of them (say, the third, fourth and fifth elements), use .slice()

或者，如果您想要其中的一部分(例如，第三、第四和第五元素)，可以使用.slice()

var $third4th5thElements = $jqObj.slice(2, 5);

#4

11  

I think you can use this

我想你可以用这个

$("ul li:nth-child(2)").append("<span> - 2nd!</span>");

It finds the second li in each matched ul and notes it.

它在每个匹配的ul中找到第二个li并注意到它。

#5

9  

.eq() -An integer indicating the 0-based position of the element.

.eq() -一个整数，表示元素的基于0的位置。

Ex:

例:

Consider a page with a simple list on it:

考虑一个页面，上面有一个简单的列表:

<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
</ul>

We can apply this method to the set of list items:

我们可以将此方法应用于列表项的集合:

$( "li" ).eq( 2 ).css( "background-color", "red" );

For more information : .eq()

有关更多信息:.eq()

#6

2  

If you already have the jquery object in a variable, you can also just treat it as a normal indexed array, without the use of jquery:

如果在变量中已经有jquery对象，也可以将其视为普通的索引数组，而不用jquery:

var all_rows = $("tr");
for(var i=0; i < all_rows.length; i++){
   var row = all_rows[i];
   //additionally, you can use it again in a jquery selector
   $(row).css("background-color","black");
}

Although the above example is not useful in any way, it is representing how you can treat objects created by jquery as indexed arrays.

尽管上面的示例没有任何用处，但它代表了如何将jquery创建的对象作为索引数组。

#7

1  

If I understand your question correctly, you can always just wrap the get function like so:

如果我正确理解了你的问题，你可以把get函数包装成这样:

var $someJqueryEl = $($('.myJqueryEls').get(3));

#8

1  

If you want to fetch particular element/node or tag in loop for e.g.

如果你想在循环中获取特定的元素/节点或标记，例如。

<p class="weekday" data-today="monday">Monday</p>
<p class="weekday" data-today="tuesday">Tuesday</p>
<p class="weekday" data-today="wednesday">Wednesday</p>
<p class="weekday" data-today="thursday">Thursday</p>

So, from above code loop is executed and we want particular field to select for that we have to use jQuery selection that can select only expecting element from above loop so, code will be

因此，从上面的代码循环执行，我们想要为此选择特定的字段，我们必须使用jQuery选择，它只能从上面的循环中选择预期元素，因此，代码将是

$('.weekdays:eq(n)');

e.g.

如。

$('.weekdays:eq(0)');

as well as by other method

以及其他方法

$('.weekday').find('p').first('.weekdays').next()/last()/prev();

but first method is more efficient when HTML <tag> has unique class name.

但是当HTML 具有唯一的类名时，第一种方法更有效。

NOTE:Second method is use when their is no class name in target element or node.

注意:第二个方法是在目标元素或节点中没有类名时使用。

for more follow https://api.jquery.com/eq/

更多遵循https://api.jquery.com/eq/

#9

0  

For iterations using a selector doesn't seem to make any sense though:

对于使用选择器进行迭代似乎没有任何意义:

var some = $( '...' );

for( i = some.length -1; i>=0; --i )
{
   // Have to transform in a jquery object again:
   //
   var item = $( some[ i ] );

   // use item at will
   // ...
}

#10

0  

Live Example to access and remove the Nth element with jQuery:

<html>
<head></head>
<body>
    <script type="text/javascript" 
    src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
    <script type="text/javascript">
      $(document).ready(function(){
        $('li:eq(1)').hide();
      });
    </script>
    <ol>
      <li>First</li>
      <li>Second</li>
      <li>Third</li>
    </ol>
</body>
</html>

When it runs, there are two items in the ordered list that show, First, and Third. The second was hidden.

当它运行时，在有序列表中有两个项目显示，第一和第三。第二个是隐藏的。

#11

0  

 $(function(){
            $(document).find('div').siblings().each(function(){
                var obj = $(this);
                obj.find('div').each(function(){
                    var obj1 = $(this);
                    if(!obj1.children().length > 0){
                        alert(obj1.html());
                    }
                });

            });
        });

<div id="2">
    <div>
        <div>
            <div>XYZ Pvt. Ltd.</div>
        </div>
    </div>
</div>
<div id="3">
    <div>
        <div>
            <div>ABC Pvt Ltd.</div>
        </div>
    </div>
</div>

#1

262  

Why not browse the (short) selectors page first?

为什么不先浏览(短)选择器页面?

Here it is: the :eq() operator. It is used just like get(), but it returns the jQuery object.

这里是:eq()操作符。它就像get()一样使用，但是它返回jQuery对象。

Or you can use .eq() function too.

也可以使用.eq()函数。

#2

277  

You can use the :eq selector, for example:

您可以使用:eq选择器，例如:

$("td:eq(2)").css("color", "red"); // gets the third td element

Or the Traversing/eq function:

或遍历/ eq函数:

$("td").eq(2).css("color", "red");

Also, remember that the indexes are zero-based.

另外，请记住这些索引是基于零的。

#3

45  

if you have control over the query which builds the jQuery object, use :eq()

如果您控制了构建jQuery对象的查询，请使用:eq()

$("div:eq(2)")

If you don't have control over it (for example, it's being passed from another function or something), then use .eq()

如果您无法控制它(例如，它正在从另一个函数或其他函数传递)，那么使用.eq()

var $thirdElement = $jqObj.eq(2);

Or if you want a section of them (say, the third, fourth and fifth elements), use .slice()

或者，如果您想要其中的一部分(例如，第三、第四和第五元素)，可以使用.slice()

var $third4th5thElements = $jqObj.slice(2, 5);

#4

11  

I think you can use this

我想你可以用这个

$("ul li:nth-child(2)").append("<span> - 2nd!</span>");

It finds the second li in each matched ul and notes it.

它在每个匹配的ul中找到第二个li并注意到它。

#5

9  

.eq() -An integer indicating the 0-based position of the element.

.eq() -一个整数，表示元素的基于0的位置。

Ex:

例:

Consider a page with a simple list on it:

考虑一个页面，上面有一个简单的列表:

<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
</ul>

We can apply this method to the set of list items:

我们可以将此方法应用于列表项的集合:

$( "li" ).eq( 2 ).css( "background-color", "red" );

For more information : .eq()

有关更多信息:.eq()

#6

2  

If you already have the jquery object in a variable, you can also just treat it as a normal indexed array, without the use of jquery:

如果在变量中已经有jquery对象，也可以将其视为普通的索引数组，而不用jquery:

var all_rows = $("tr");
for(var i=0; i < all_rows.length; i++){
   var row = all_rows[i];
   //additionally, you can use it again in a jquery selector
   $(row).css("background-color","black");
}

Although the above example is not useful in any way, it is representing how you can treat objects created by jquery as indexed arrays.

尽管上面的示例没有任何用处，但它代表了如何将jquery创建的对象作为索引数组。

#7

1  

If I understand your question correctly, you can always just wrap the get function like so:

如果我正确理解了你的问题，你可以把get函数包装成这样:

var $someJqueryEl = $($('.myJqueryEls').get(3));

#8

1  

If you want to fetch particular element/node or tag in loop for e.g.

如果你想在循环中获取特定的元素/节点或标记，例如。

<p class="weekday" data-today="monday">Monday</p>
<p class="weekday" data-today="tuesday">Tuesday</p>
<p class="weekday" data-today="wednesday">Wednesday</p>
<p class="weekday" data-today="thursday">Thursday</p>

So, from above code loop is executed and we want particular field to select for that we have to use jQuery selection that can select only expecting element from above loop so, code will be

因此，从上面的代码循环执行，我们想要为此选择特定的字段，我们必须使用jQuery选择，它只能从上面的循环中选择预期元素，因此，代码将是

$('.weekdays:eq(n)');

e.g.

如。

$('.weekdays:eq(0)');

as well as by other method

以及其他方法

$('.weekday').find('p').first('.weekdays').next()/last()/prev();

but first method is more efficient when HTML <tag> has unique class name.

但是当HTML 具有唯一的类名时，第一种方法更有效。

NOTE:Second method is use when their is no class name in target element or node.

注意:第二个方法是在目标元素或节点中没有类名时使用。

for more follow https://api.jquery.com/eq/

更多遵循https://api.jquery.com/eq/

#9

0  

For iterations using a selector doesn't seem to make any sense though:

对于使用选择器进行迭代似乎没有任何意义:

var some = $( '...' );

for( i = some.length -1; i>=0; --i )
{
   // Have to transform in a jquery object again:
   //
   var item = $( some[ i ] );

   // use item at will
   // ...
}

#10

0  

Live Example to access and remove the Nth element with jQuery:

<html>
<head></head>
<body>
    <script type="text/javascript" 
    src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
    <script type="text/javascript">
      $(document).ready(function(){
        $('li:eq(1)').hide();
      });
    </script>
    <ol>
      <li>First</li>
      <li>Second</li>
      <li>Third</li>
    </ol>
</body>
</html>

When it runs, there are two items in the ordered list that show, First, and Third. The second was hidden.

当它运行时，在有序列表中有两个项目显示，第一和第三。第二个是隐藏的。

#11

0  

 $(function(){
            $(document).find('div').siblings().each(function(){
                var obj = $(this);
                obj.find('div').each(function(){
                    var obj1 = $(this);
                    if(!obj1.children().length > 0){
                        alert(obj1.html());
                    }
                });

            });
        });

<div id="2">
    <div>
        <div>
            <div>XYZ Pvt. Ltd.</div>
        </div>
    </div>
</div>
<div id="3">
    <div>
        <div>
            <div>ABC Pvt Ltd.</div>
        </div>
    </div>
</div>
标签：

相关文章