JavaScript/jQuery : hasDescendant/hasAncestor

Question

可笑的是，我很难找到任何半好的方法来确定一个 HTML 元素是否在另一个元素中——这似乎应该是遍历和分析 HTML DOM 的基本核心特征.我对缺少“hasDescendant”(或类似的)方法感到非常惊讶和失望。

我正在尝试这样做:

var frog = $('#frog');
var walrus = $('#walrus');
if (frog.hasDescendant(walrus)) console.log("Frog is within walrus.");
else console.log("Frog is outside walrus.");

我尝试使用许多 jQuery 组合来重现我正在寻找的内容。

walrus.is(frog.parents());
walrus.has(frog);
walrus.find(' *').has(frog);
frog.is(walrus.find(' *'));

我还没有找到可行的解决方案。

---

[编辑]
解决方案: walrus.has(frog)
备用: if (walrus.has(frog)) { doStuff(); }
备用: var booleanResult = walrus.has(frog).length>0;

---

//追逐。

Answer 1

jQuery 有这个功能:jQuery.contains : “检查一个 DOM 元素是否在另一个 DOM 元素中。”

演示(live copy):

HTML:

<p id="frog">Frog <span id="walrus">walrus</span></p>

JavaScript:

jQuery(function($) {
  var frog = $("#frog"),
      walrus = $("#walrus");

  display("frog contains walrus? " + $.contains(frog[0], walrus[0]));
  display("walrus contains frog? " + $.contains(walrus[0], frog[0]));

  function display(msg) {
    $("<p>").html(msg).appendTo(document.body);
  }
});