给定HTML，例如：
<div>
<span>Hello</span>
<p class="selected">Hello Again</p>
<div class="selected">And Again</div>
<p>And One Last Time</p>
</div>和联署材料，例如：
$( "div" ).children( ".selected" )[0].css( "color", "blue" ); // this doesn't work它不会抓取第一个选定的元素。如何使它工作?
注意:这是一个循环，所以我可以访问一个var i。
回答 4
Stack Overflow用户
回答已采纳
发布于 2017-02-02 09:34:35
使用.eq
$("div").children(".selected").eq(0).css("color", "blue");或
$("div").children(".selected:eq(0)").css("color", "blue");Stack Overflow用户
发布于 2017-02-02 09:34:23
$( "div" ).children(".selected").first().css( "color", "blue" ); // this worksStack Overflow用户
发布于 2017-02-02 09:41:37
每个jQuery对象还伪装成一个数组，所以当您使用
.children( ".selected" )[0].css( "color", "blue" )您正在取消对jQuery对象的引用并获取本机DOM元素。这方面的问题是，您试图在其上使用jQuery方法(.css())，这就是它失败的原因。
要在jQuery中选择第一个匹配项，通常使用.eq(0)、:eq(0)或:first
示例1
$( "div" ).children( ".selected:first" ).css( "color", "blue" ); body {
font-size: 16px;
font-weight: bolder;
}
p { margin: 5px 0; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<span>Hello</span>
<p class="selected">Hello Again</p>
<div class="selected">And Again</div>
<p>And One Last Time</p>
</div>
示例2
$( "div" ).children( ".selected:eq(0)" ).css( "color", "blue" );body {
font-size: 16px;
font-weight: bolder;
}
p { margin: 5px 0; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<span>Hello</span>
<p class="selected">Hello Again</p>
<div class="selected">And Again</div>
<p>And One Last Time</p>
</div>
示例3
$( "div" ).children( ".selected" ).eq(0).css( "color", "blue" );body {
font-size: 16px;
font-weight: bolder;
}
p { margin: 5px 0; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<span>Hello</span>
<p class="selected">Hello Again</p>
<div class="selected">And Again</div>
<p>And One Last Time</p>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/42008657
复制
腾讯云开发者
