如何選擇兒童元素？

Question

html

<div class="one"> 
    <div class="two"> 
     <div class="three">text</div> 
    </div> 
</div> 

如何選擇兒童元素。我試過這個。

$('.one').children('.three').css('color','#f00'); 

我知道.find（）函數，但想知道另一種方法。

Answer 1

嘗試這些線路之一：

$('.one').children().children('.three').css('color','#f00'); 
$('.one').children('.two').children('.three').css('color','#f00'); 
$('.one').children('.two').find('.three').css('color','#f00'); 

希望它會幫助你。

Answer 2

你也可以這樣做：

$('.one > .two').children('.three').css('color','#f00'); 

當然還是：

$('.one > .two > .three').css('color','#f00'); 

這裏是一個小提琴：http://jsfiddle.net/3nhrh/1/

Answer 3

你可以隨時更改選擇器鏈一起上課：

$(".one .three").css("color", "#f00"); 

這將選擇具有類.three

Answer 4

您可以使用上下文選擇的.one類的任何子女：

$('.three', $('#one')).css(..... 

Answer 5

以下方法可能會幫助您：

var children=$('.one').children(); 

children.each(function(idx, val){ 
    $(this).css('color','#f00'); 
}); 

JSFiddle

Answer 6

嘗試

$('.one > div.three').css('color','#f00'); 

Answer 7

試試這個... jsfiddle

$("div").children(".two").css("color", "blue"); 

Answer 8

這一切都取決於正是你想要達到的目標。

如果在文檔中只存在一次「three」類的項目（或者想要獲取所有項目），則可以使用$('.three')。

，如果你正在尋找任何「三」，即後代或「二」是的後代「一」使用$('.one .two .three')

，如果你想在同一只，他們是直接的孩子，你可以使用$('.one > .two > .three')

如果你碰巧已經jQuery對象爲「一個」節點可以限制你以前的搜索是這樣的： $('.three' , theOne)，$(' .two .three' , theOne)或$(' > .two > .three', theOne)

我希望其中的一個滿足您的需求，如果不是t如果你應該更好地澄清究竟是什麼情況。