javascript - 为什么新设置的属性不会保留在 jQuery 对象上，但会保留在 dom 元素上？

Question

elem是 id 为 dummy 的 dom 元素。jElem是包裹在elem.

obj1具有init在传递给它的参数上设置属性的方法。在这里，它创建一个新属性prop并设置true它。在其方法obj2中也传递了相同的参数。还有一种方法可以打印在传递的参数上设置的属性。以下是代码：initobj2showProp

let elem = document.querySelector("#dummy");

let obj1 = {
  init(item){
    item.prop = true;
  }
};
let obj2 = {
  init(item){
    this.item = item;
  },
  showProp(){
    console.log(this.item.prop);
  }
};
obj1.init($(elem));
obj2.init($(elem));
obj2.showProp(); //undefined

obj1.init(elem);
obj2.init(elem);
obj2.showProp(); //true

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="dummy">dummy</div>

我担心的是：当jElem两个对象都传入时，jElem 上的属性不会持久化。但是当 dom 元素通过自身（elem）传递时，该属性仍然存在。这是为什么？

标签： javascriptjquery

Answer 1

我很抱歉造成误解。我真的很傻。我没有睡觉，也无法正确调试。问题是我正在编写如下代码：

let elem = document.querySelector("#dummy");

let obj1 = {
  init(item){
    item.prop = true;
  }
};
let obj2 = {
  init(item){
    this.item = item;
  },
  showProp(){
    console.log(this.item.prop);
  }
};
obj1.init($(elem));
obj2.init($(elem));
obj2.showProp(); //undefined

obj1.init(elem);
obj2.init(elem);
obj2.showProp(); //true

这显然符合预期，因为我在传递给函数时创建了一个新的 jQuery 对象：obj1.init($(elem))和obj2.init($(elem));. 在这里，显然这两种init方法都传递了 2 个不同的对象而不是同一个对象。