几种方式：

if (element.firstChild) {
    // It has at least one
}

或hasChildNodes()功能：

if (element.hasChildNodes()) {
    // It has at least one
}

或length财产childNodes：

if (element.childNodes.length > 0) { // Or just `if (element.childNodes.length)`
    // It has at least one
}

如果您只想了解所有现代浏览器（和 IE8 — 事实上，甚至 IE6）上的子元素（而不是文本节点、属性节点等），您可以这样做：（谢谢Florian！）

if (element.children.length > 0) { // Or just `if (element.children.length)`
    // It has at least one element as a child
}

这依赖于children房地产，这是不是在定义DOM1，DOM2，或 DOM3，但其中有接近普遍支持。（它在 IE6 及更高版本以及 Chrome、Firefox 和 Opera 中工作，至少可以追溯到 2012 年 11 月，当它最初编写时。）如果支持较旧的移动设备，请务必检查支持。

如果您不需要 IE8 及更早版本的支持，您也可以这样做：

if (element.firstElementChild) {
    // It has at least one element as a child
}

那依赖于firstElementChild. 就像children，它也没有在 DOM1-3 中定义，但不像children它直到 IE9 才被添加到 IE。这同样适用于childElementCount：

if (element.childElementCount !== 0) {
    // It has at least one element as a child
}

如果你想坚持 DOM1 中定义的东西（也许你必须支持真正晦涩的浏览器），你必须做更多的工作：

var hasChildElements, child;
hasChildElements = false;
for (child = element.firstChild; child; child = child.nextSibling) {
    if (child.nodeType == 1) { // 1 == Element
        hasChildElements = true;
        break;
    }
}

所有这些都是DOM1 的一部分，并且几乎得到普遍支持。

将其包装在一个函数中很容易，例如：

function hasChildElement(elm) {
    var child, rv;

    if (elm.children) {
        // Supports `children`
        rv = elm.children.length !== 0;
    } else {
        // The hard way...
        rv = false;
        for (child = element.firstChild; !rv && child; child = child.nextSibling) {
            if (child.nodeType == 1) { // 1 == Element
                rv = true;
            }
        }
    }
    return rv;
}

正如 slashnick & bobince 所提到的，hasChildNodes()对于空白（文本节点）将返回 true。但是，我不想要这种行为，这对我有用:)

element.getElementsByTagName('*').length > 0

编辑：对于相同的功能，这是一个更好的解决方案：

 element.children.length > 0

children[]是 的子集childNodes[]，仅包含元素。

兼容性

您还可以执行以下操作：

if (element.innerHTML.trim() !== '') {
    // It has at least one
} 

这使用 trim() 方法将只有空格（在这种情况下hasChildNodes返回 true）的空元素视为空元素。

注意：上述方法不会过滤掉评论。（所以评论会将一个孩子分类）

为了过滤掉评论，我们可以使用只读的Node.nodeType属性，其中Node.COMMENT_NODE(A Comment 节点，例如<!-- … -->) 具有常量值 - 8

if (element.firstChild?.nodeType !== 8 && element.innerHTML.trim() !== '' {
   // It has at least one
}

let divs = document.querySelectorAll('div');
for(element of divs) {
  if (element.firstChild?.nodeType !== 8 && element.innerHTML.trim() !== '') {
   console.log('has children')
  } else { console.log('no children') }
}

<div><span>An element</span>
<div>some text</div>
<div>     </div> <!-- whitespace -->
<div><!-- A comment --></div>
<div></div>

您可以检查元素是否有子节点element.hasChildNodes()。当心在 Mozilla 中，如果标签后面是空格，这将返回 true，因此您需要验证标签类型。

https://developer.mozilla.org/En/DOM/Node.hasChildNodes

试试childElementCount 属性：

if ( element.childElementCount !== 0 ){
      alert('i have children');
} else {
      alert('no kids here');
}