選擇jQuery中另一個類的元素的子元素的第一個元素

我想選擇一個類的第一個元素，它們是使用jQuery的另一個類的元素的子元素。請看下面的例子來理解我的問題。選擇jQuery中另一個類的元素的子元素的第一個元素

<div class="a"> 
    <div class="c"></div> 
    <div></div> 
    <div class="b">Select this</div> 
    <div class="b"></div> 
    <div class="b"></div> 
</div> 
<div class="a"> 
    <div></div> 
    <div class="c"></div> 
    <div class="b">Select this</div> 
    <div class="b"></div> 
    <div class="b"></div> 
</div> 
<div class="a"> 
    <div class="b">Select this</div> 
    <div class="b"></div> 
    <div class="b"></div> 
    <div></div> 
    <div class="c"></div> 
</div>

我想在jQuery中編寫一個代碼，它將選擇類a中所有元素下的所有第一個b類元素。

如果我使用jQuery中下面的代碼，它不工作：

$(".a div.b:first-child").html('Changed!!!!');

如何選擇這些div，我標記爲「選擇此」在HTML？

來源

2012-11-12 Debiprasad

使用:first而不是:first-child並且還可以使用.find作爲特定部分。見下文，

$(".a").find("div.b:first").html('Changed!!!!');

DEMO：http://jsfiddle.net/kjV5j/1/

來源

2012-11-12 18:52:31

>因爲：首先是jQuery擴展，而不是CSS規範的一部分，q ueries使用：首先不能利用本機DOM querySelectorAll（）方法提供的性能提升。 –

@MaratTanalin'first-child'表示任何元素，它是父級的第一個子元素。我不認爲它可以在這種情況下使用。 –

這種情況完全通過_two_選擇器解決，如[我的答案]（http://stackoverflow.com/a/13349667/1211187）。 –

這應該工作：

.a > .b:first-child, .a > :not(.b) + .b

jsFiddle demo

與jQuery的支持非標準:first僞類相比，這應該工作得更快在瀏覽器支持原生querySelectorAll()（IE9 +）。

來源

2012-11-12 18:52:06

試試這個：

$(".a div.b:eq(0)").html('Changed!!!!'); 
    // OR 
    $(".a div.b:first").html('Changed!!!!');

來源

2012-11-12 18:53:16

如果要更改標籤的文本已經 '選擇這個'：

$('.a div').each(function() 
{ 
    if ($(this).html() == 'Select this') 
    $(this).html('changed'); 
});

來源

2012-11-12 18:53:25

元素不會總是有「選擇這個」，他只是以此爲例。 –

選擇jQuery中另一個類的元素的子元素的第一個元素

回答

相關問題