使用 Jquery 选择第一个孩子的孩子
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7040589/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Select first child's children with Jquery
提问by elbatron
I have a html structure like this:
我有一个这样的 html 结构：
<div class="one">
<div id="two">
<h2>Any</h2>
<h4>Any</h4>
</div>
<div id="three">
</div>
</div>
I have to select the first and the first's children elements, in the above case: #two, h2, h4, without knowing the first element's id name. How could I do that?
我必须选择第一个和第一个的子元素，在上面的例子中：#two, h2, h4，不知道第一个元素的 id 名称。我怎么能那样做？
I can select the first element but if I add contents().find() to div:first I can't select its children:
我可以选择第一个元素，但是如果我将 contents().find() 添加到 div:first 我不能选择它的孩子：
$(document).ready(function() {
$(".one").mouseover(function () {
$(this).children('div:first').contents().find('h2,h4').stop(true, true).fadeIn('fast');
});
$(".one").mouseout(function () {
$(this).children('div:first').contents().find('h2,h4').stop(true, true).fadeOut('fast');
});
});
The final and working (no flicker!) code is:
最终的工作（没有闪烁！）代码是：
$(".one").hover(function () {
$(this).children('div:first').stop(true, true).fadeIn('fast');
}, function() {;
$(this).children('div:first').stop(true, true).fadeOut('fast');
});
I guess I have to give myself more time to think before coming here and asking questions. Anyway, I learned about .andSelf() and the a bit of Jquery syntax. Thanks again.
我想在来这里提问之前，我必须给自己更多的时间思考。无论如何，我了解了 .andSelf() 和一些 Jquery 语法。再次感谢。
回答by irama
You don't need to use both find()and contents()- Try this:
你不需要同时使用find()和contents()- 试试这个：
$(document).ready(function() {
$(".one").mouseover(function () {
$(this).children('div:first').children('h2,h4').stop(true, true).fadeIn('fast');
});
$(".one").mouseout(function () {
$(this).children('div:first').children('h2,h4').stop(true, true).fadeOut('fast');
});
});
And if you need to also keep the 'first' element in the nodeset, use .andSelf()after the second .children()(as per @Felix 's answer).
如果您还需要在节点集中保留“第一个”元素，请.andSelf()在第二个元素之后使用.children()（根据 @Felix 的回答）。
回答by Felix Kling
You can use children[docs]and andSelf[docs]:
您可以使用children[docs]和andSelf[docs]：
$(".one").mouseover(function () {
$(this).children().first().children('h2, h4').andSelf()....
});
If you don't want to add the first child (the parent) to the set, omit andSelf. Your question is a bit vague in this point. But I assume you actually don't want to select the first child, only its children. If you hide an element, its children are hidden too.
如果您不想将第一个孩子（父母）添加到集合中，请省略andSelf. 你的问题在这一点上有点含糊。但我假设您实际上不想选择第一个孩子，只想选择它的孩子。如果你隐藏一个元素，它的子元素也会被隐藏。
回答by xandercoded
This:
这个：
$(this).children('div:first').contents().find('h2,h4').stop(true, true).fadeIn('fast');
To:
到：
$(this).children('div:first').children('h2,h4').stop(true, true).fadeIn('fast');
