Answers:
.eq()
更适合OP的问题。:eq()
在的字符串参数中使用$
,而是.eq()
现有jQuery对象上的方法。
$('select').find('option').eq(n)
基本上将忽略分组,并整体获得所有选项。如果您希望每个组都这样,则必须执行以下操作:$('select').find('optgroup').each(function() { $(this).find('option').eq(n)...; })
您可以使用:eq选择器,例如:
$("td:eq(2)").css("color", "red"); // gets the third td element
或eq(int)函数:
$("td").eq(2).css("color", "red");
另外,请记住索引是从零开始的。
:nth()
选择器–不要与:nth-child()
如果您可以控制构建jQuery对象的查询,请使用 :eq()
$("div:eq(2)")
如果您无法控制它(例如,它是从另一个函数或其他东西传递过来的),请使用 .eq()
var $thirdElement = $jqObj.eq(2);
或者,如果您想要其中的一部分(例如,第三,第四和第五个元素),请使用 .slice()
var $third4th5thElements = $jqObj.slice(2, 5);
.eq()
而不是:eq()
实际使用。性能略有提升。
.eq()-一个整数,指示元素从0开始的位置。
例如:
考虑一个带有简单列表的页面:
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
</ul>
我们可以将此方法应用于列表项集:
$( "li" ).eq( 2 ).css( "background-color", "red" );
如果已经在变量中包含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");
}
尽管上面的示例在任何方面都没有用,但是它代表了如何将jquery创建的对象视为索引数组。
<select>
元素列表,并且您想要选定的组合框元素,请使用$(row).val();
如果您想获取特定的元素/节点或循环标记,例如
<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>
因此,从上面的代码循环开始执行,我们要选择特定的字段,因此我们必须使用jQuery选择,该选择只能从上面的循环中选择期望的元素,因此代码将是
$('.weekdays:eq(n)');
例如
$('.weekdays:eq(0)');
以及其他方法
$('.weekday').find('p').first('.weekdays').next()/last()/prev();
但是第一种方法在以下情况下效率更高 HTML <tag>
具有唯一的类名。
注意:当在目标元素或节点中它们不是类名时,将使用第二种方法。
对于使用选择器的迭代似乎没有任何意义:
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
// ...
}
<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>
运行时,顺序列表中将显示两个项目:第一和第三。第二个被隐藏了。
$(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>
.eq()
的,而不是:eq()
?