检查元素是否有子

在开发 Web 应用程序时，经常需要检查一个元素是否有子元素。在 jQuery 中，可以使用 children() 方法来获取一个元素的直接子元素，并使用 .length 属性来判断是否有子元素。

示例代码

// HTML 代码
<div id="parent">
  <div class="child"></div>
  <div class="child"></div>
</div>

// 检查元素是否有子
if ($('#parent').children().length) {
  console.log('Parent has children');
} else {
  console.log('Parent has no children');
}

解释说明

以上代码定义了一个父元素 #parent 和两个子元素 .child。使用 jQuery 选择器 $() 得到被选中的元素 #parent。然后使用 .children() 方法获取 #parent 的所有子元素，这包括两个 .child 元素。最后使用 .length 属性来获取子元素数量，并将其作为条件语句中的参数。

如果子元素数量大于 0，则说明该元素有子元素。在这种情况下，会输出 Parent has children。否则，会输出 Parent has no children。

参考链接

• jQuery API 文档 - children()