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

我正在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

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

回答

相關問題