Javascript 将样式附加到 event.target

Question

我有一个函数clickEvent(event)和一个数组。我想将元素推送到数组，然后循环遍历此列表，将这些元素与包含相同元素的另一个数组的元素进行比较。问题是，当我向元素添加样式时，该元素的 HTML 发生变化，不再与其他列表中的元素相同。为什么包含样式的元素会添加到列表中？我在推送元素后添加样式，所以我不明白为什么会发生这种情况。

是否有另一种方法可以向元素添加背景而不向所述元素附加样式？

clickEvent(event) { 
   array.push(event.target);
   event.target.style.background = 'red';
} 

Answer 1

您添加到列表中的只是对 HTML 元素的引用，而不是实际元素本身。您需要做的是克隆事件目标并将克隆添加到列表中。

例如:

array.push(event.target.cloneNode());

这将创建该元素的全新副本，当原始元素更改时，该副本不会更改。

有关cloneNode方法的更多信息可以在 https://developer.mozilla.org/en-US/docs/Web/API/Node/cloneNode 找到