javascript - 从 DOM 中删除一个类也会从变量中的项目中删除它

Question

当我使用

$('span').removeClass('reallyRed');

要从 DOM 中删除一个类，它会这样做。耶！但是，如果我将 HTML 元素推送到变量中，myVar.push(this)那么.removeClass()也会在其中找到类myVar并将它们也从变量中删除！

这是 JSFiddle。为什么会这样？我怀疑这与 jQuery 如何看待 DOM 有关，但这可能与我.push()在.each()循环中的使用方式有关。

Answer 1

clone()在将元素推入变量时使用函数制作元素的副本：

myVar.push($(this).clone()[0]);

举个例子：

var obj = {
    "key1": "val1",
    "key2": "val2",
    "key3": "val3"
};

var array = [];
array.push(obj);
console.log(obj); // { "key1": "val1", "key2": "val2", "key3": "val3"}
delete array[0].key1;
console.log(obj); // { "key2": "val2", "key3": "val3"}

发生这种情况是因为对象具有相同的引用（在删除第一个键array[0] === obj之前和之后）。

这就是你需要clone()jQuery 函数的原因。

从文档：

.clone()

创建匹配元素集的深层副本。

您的 javascript 代码变为：

$('div').each(function(e) {
    myVar.push($(this).clone()[0]);
});

JSFIDDLE