其他分享
首页 > 其他分享> > JQuery 判断父节点下是否有子节点

JQuery 判断父节点下是否有子节点

作者:互联网

查找父节点下是否有子节点有两个情况:(1)查找的是父元素其所有节点以及其衍生节点;(2)查找其符元素的子节点。

查找父元素的衍生节点

has() 以及 find() 函数能找到父元素的子节点以及所有的衍生节点。查找的深度非常深,直到这个节点没有衍生的节点为止。

<div id="app">
  <div>
    <span></span>
  </div>
  <div>
    <span><a></a></span>
  </div>
</div>

has

function hasDerivedNode(selector, find) {
  return !!$(selector).has(find).length;
}

hasDerivedNode("#app", "a"); // => true
hasDerivedNode("span", "img"); // => false

find

function hasDerivedNode(selector, find) {
  return !!$(selector).find(find).length;
}

hasDerivedNode("#app", "img"); // => false
hasDerivedNode("#app", "a"); // => true

查找父元素的子节点

判断父元素的子节点用 children() 函数最合适,这个函数是查找每一个元素的子节点,不包括衍生节点。查找的深度只有一层。

<div id="app">
  <div>
    <span></span>
  </div>
  <div>
    <span><a></a></span>
  </div>
</div>
function hasChildNode(selector, find) {
  return !!$(selector).children(find).length;
}

hasChildNode("span"); // => true
hasChildNode("#app", "span"); // => false

标签:JQuery,有子,元素,find,查找,hasDerivedNode,selector,节点
来源: https://www.cnblogs.com/shiramashiro/p/16322414.html