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

我正在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元素的相对路径，然后“应用”在另一个元素上？

来源

2017-05-31 Yair Levy

为什么不直接选择元素，而不是遍历虽然DOM？ – evolutionxbox

你有没有试过重新使用选择器？选择器只是一个字符串，我，e：'input .withclass'，你应该可以在任何元素集上重新使用它。 – Nope

也许以某种方式标记已经过测试的元素？例如使用数据集。 – Deus777

-1

你可以使用jQuery。

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

什么是确定目标的子元素从他们相对的位置开始。在你的情况，如果你想从你的第一个元素开始并深入到星号的一个，你可以这样做：

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

这里做的事情是，它需要#myelement作为一个基地，你会开始搜索，之后，它下降到第二个子元素是一个div，并再次进入这个div的第二个子元素。您可以重用该选择器与不同的基地。

来源

2017-05-31 12:57:15

请不要推荐使用jQuery，如果它既没有被标记也没有在问题中引用。 – evolutionxbox

OP似乎想要提高运行时间只有几ms的测试速度，引入另一个库可能不会加速测试。 – Nope

对不起，也许OP想要纯JavaScript，出于任何原因。但我不确定演出会如此糟糕。 –

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

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

来源

2017-05-31 13:12:48

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

回答

相关问题