如何计算两个DOM元素之间的关系?即他们有多接近(相关)

时间:2013-04-26 13:30:48

标签: javascript jquery

我想找到一种方法来分辨两个DOM元素之间的距离。不是以像素为单位,而是在遍历步骤中。

实际应用如下:有一个核心元素,需要在网站中找到其他类似的元素,并模仿最相关的行为。

E.g。标签中没有设置宽度的图库。不可见的标签可能没有宽度,因此除非在显示标签时重新初始化,否则标签中的图库将不可见。隐藏的图库将是核心元素,它将寻找另一个可能正常工作的画廊实例并复制其宽度以便工作。工作库可以位于第一个选项卡中,也可以位于内容中,也可以位于侧边栏或页脚中的小图库中。我想要的是它“知道”最接近的相关其他实例是另一个选项卡上的实例,而不是页脚中的实例。由于这是一个WP插件,我不能硬编码任何东西,而且场景不仅限于标签。

.closest()不能用于此目的。

1 个答案:

答案 0 :(得分:2)

我发现,对于这个目的,最有效的解决方案是:

var commonParentsDepth = a.parents().has(b).first().parents().length;

你会得到一个数字,告诉你这两个元素的共同祖先有多深。您在循环中对多个元素进行此测试,一次比较两个元素,其中一个元素不会改变。如果两个元素比其他元素更紧密相关,您将能够通过结果来判断。数字越大,你的两个元素越向下,这意味着它们越接近。

注意:这不是用于将两个元素与另外两个元素进行比较。

我把这两个有些相关的问题结合起来了: