jquery div id 是否有孩子
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1526873/
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
jquery if div id has children
提问by Chris
This if-condition is what's giving me trouble:
这个if-condition 给我带来了麻烦：
if (div id=myfav has children) {
do something
} else {
do something else
}
I tried all the following:
我尝试了以下所有方法：
if ( $('#myfav:hasChildren') ) { do something }
if ( $('#myfav').children() ) { do something }
if ( $('#myfav:empty') ) { do something }
if ( $('#myfav:not(:has(*))') ) { do something }
回答by S Pangborn
if ( $('#myfav').children().length > 0 ) {
// do something
}
This should work. The children()function returns a JQuery object that contains the children. So you just need to check the size and see if it has at least one child.
这应该有效。该children()函数返回一个包含子项的 JQuery 对象。所以你只需要检查尺寸，看看它是否至少有一个孩子。
回答by dcharles
This snippet will determine if the element has children using the :parentselector:
此代码段将使用:parent选择器确定元素是否具有子元素：
if ($('#myfav').is(':parent')) {
// do something
}
Note that :parentalso considers an element with one or more text nodes to be a parent.
请注意，它:parent还将具有一个或多个文本节点的元素视为父元素。
Thus the divelements in <div>some text</div>and <div><span>some text</span></div>will each be considered a parent but <div></div>is not a parent.
因此div，<div>some text</div>和 中的元素都<div><span>some text</span></div>将被视为父元素，但<div></div>不是父元素。
回答by KyleFarris
Another option, just for the heck of it would be:
另一种选择，只是为了它会是：
if ( $('#myFav > *').length > 0 ) {
// do something
}
May actually be the fastest since it strictly uses the Sizzle engine and not necessarily any jQuery, as it were. Could be wrong though. Nevertheless, it works.
实际上可能是最快的，因为它严格使用 Sizzle 引擎，而不一定是任何 jQuery，就像它一样。虽然可能是错的。尽管如此，它仍然有效。
回答by Simon
There's actually quite a simple native method for this:
实际上有一个非常简单的本地方法：
if( $('#myfav')[0].hasChildNodes() ) { ... }
Note that this also includes simple text nodes, so it will be true for a <div>text</div>.
请注意，这也包括简单的文本节点，因此对于<div>text</div>.
回答by suhailvs
and if you want to check div has a perticular children(say <p>use:
如果你想检查 div 有一个特定的孩子（比如<p>使用：
if ($('#myfav').children('p').length > 0) {
// do something
}
回答by Rakesh Chaudhari
You can also check whether div has specific children or not,
您还可以检查 div 是否有特定的孩子，
if($('#myDiv').has('select').length>0)
{
// Do something here.
console.log("you can log here");
}
回答by John Slegers
The jQuery way
jQuery 方式
In jQuery, you can use $('#id').children().length > 0to test if an element has children.
在 jQuery 中，你可以$('#id').children().length > 0用来测试一个元素是否有子元素。
Demo
演示
var test1 = $('#test');
var test2 = $('#test2');
if(test1.children().length > 0) {
test1.addClass('success');
} else {
test1.addClass('failure');
}
if(test2.children().length > 0) {
test2.addClass('success');
} else {
test2.addClass('failure');
}.success {
background: #9f9;
}
.failure {
background: #f99;
}<script src="https://code.jquery.com/jquery-1.12.2.min.js"></script>
<div id="test">
<span>Children</span>
</div>
<div id="test2">
No children
</div>The vanilla JS way
香草 JS 方式
If you don't want to use jQuery, you can use document.getElementById('id').children.length > 0to test if an element has children.
如果您不想使用 jQuery，您可以使用document.getElementById('id').children.length > 0来测试一个元素是否有子元素。
Demo
演示
var test1 = document.getElementById('test');
var test2 = document.getElementById('test2');
if(test1.children.length > 0) {
test1.classList.add('success');
} else {
test1.classList.add('failure');
}
if(test2.children.length > 0) {
test2.classList.add('success');
} else {
test2.classList.add('failure');
}.success {
background: #9f9;
}
.failure {
background: #f99;
}<div id="test">
<span>Children</span>
</div>
<div id="test2">
No children
</div>