Question

我正在对DOM元素运行一些测试，测试的结果是元素后代之一。例如：

<div id="myelement" class="some-class">
  <div class="some-child-class"></div>
  <div class="some-other-child-class">
    <div class="grandchild-class"></div>
    <div class="another-grandchild"></div>*
  </div>
</div>

让我们假设：

test(document.getElementById('myelement'));

将返回标有星号的元素

现在我的问题是：测试过程繁重且耗费资源。我不想在没有的情况下运行它。有时候，我克隆了一个已经过测试的元素（意思是 - 我知道测试的结果），但是因为我得到了一个对象引用，所以我不能用它来访问克隆元素上的相关子元素

是否有任何有效的方法以某种方式“保存”从父元素到特定后代DOM元素的相对路径，然后将其“应用”到另一个元素上？

Answer 1

因此，您可以为每个元素分配唯一ID，并将测试结果缓存在Elements id的Object中。但是，我不知道这是否有用。示例实现：

var test=function(el){
  return this[el.id] || (this[el.id]=advancedtesting(el));
}.bind({});

所以你可以这样做：

test(document.getElementById('myelement'));//caches
test(document.getElementById('myelement'));//returns the cached

Answer 2

你可以使用jQuery。

他们使用的选择器可以采用“n-child”或“nth-of-type”的形式（参见文档here）。

对于从您从哪里开始相对的位置来定位子元素的作用是什么。在您的情况下，如果您想从第一个元素开始，然后转到已加星标的元素，您可以这样做：

$('#myelement').find('div:nth-child(2) > div:nth-child(2)')

这样做是因为它需要#myelement作为你开始搜索的基础，之后它会转到第二个子元素div，再次进入div的第二个子元素。您可以使用不同的基础重用该选择器。

如何在克隆元素上引用子元素

2 个答案: