假设我有这个DOM结构
<body>
<p>
Hello
<i>how <b>are</b> you</i>
and
<i>what <b>are <tt>you</tt> going</b> to</i>
eat tonight?
</p>
</body>
Run Code Online (Sandbox Code Playgroud)
使用jQuery我想了解FIRST的共享父代
<b>are</b>
Run Code Online (Sandbox Code Playgroud)
和
<tt>you</tt>
Run Code Online (Sandbox Code Playgroud)
从下到上,这将是<p>而不是<body>标签.
关于如何使用jQuery确定第一个共享父级的任何想法?
像这样:
$(a).parents().filter(function() { return jQuery.contains(this, b); }).first();
Run Code Online (Sandbox Code Playgroud)
如果b是选择器(而不是DOM元素),您可以将其更改为:
$(a).closest(':has(b)');
Run Code Online (Sandbox Code Playgroud)
这个更短,但速度要慢得多.
顺序a和b无关; 如果b更接近父母,它会更快.
你可以结合.parents()使用.filter(),像这样:
$("b:first").parents().filter($("tt").parents()).first()
//or more generic:
$(elem1).parents().filter($(elem2).parents()).first()
Run Code Online (Sandbox Code Playgroud)
这将获得所有共享父母,然后您可以采取.first()或.last()...无论需要什么.
你可以在这里测试一下.请注意,这比.has()我们只是比较2个DOM元素集要快得多,而不是递归地比较多个元素集.此外,所得的集将在订单涨的文件,在这个例子中<p>,然后<body>.