Javascript jQuery data（）如何中断循环引用

我读过一本书。但我真正不明白的是它是如何打破循环引用的？

它是如何打破参照圈的

$(div1).data('item', div2);
$(div2).data('item', div1);

---

例如，上面的div相互指向，如何防止？我有预感，但我只是想确定我的预感是否正确。

在某些浏览器中，当您将对DOM对象的引用作为该DOM对象的属性放置在DOM对象上时，循环引用问题就会发生。然后，有两个DOM对象彼此指向。删除具有自定义属性的DOM对象不会清除该自定义属性。一个不那么聪明的垃圾收集器没有意识到这个DOM引用不起作用，所以它会被卡住，这有几种可能导致泄漏的方法

.data（）

解决了这个问题，因为

.data（）

数据不在DOM对象上。它只是一个javascript数据结构，可以通过唯一的字符串ID与DOM对象关联

其中一个令人困惑的部分是，当您使用

.data（“key”）

进行读取时，并且在javascript

.data（）

数据结构中找不到

key

时，jQuery将查找DOM对象上名为

“data key”

的属性。但是，无论何时使用

.data（“key”、“myData”）

编写，它都不会写入DOM对象，只会写入javascript数据结构

因此，由于

.data（）

从不将数据写入DOM对象，因此不可能存在某些浏览器遇到问题的任何此类循环引用

关于

.data（）

数据结构，还需要了解一些其他有用的信息。当您使用jQuery的

.remove（）

从DOM中删除元素时，或者当您调用

$（elem）.html（“新html”）

时，jQuery将清除所有删除项上的

.data（）

数据。在这种情况下，最好不要将jQuery与普通javascript混合使用。如果您使用的是

.data（）

，则应始终使用jQuery函数从DOM中删除项，以便适当地清理

.data（）

。否则，您可以通过这种方式获得内存泄漏（无论是

.data（）

数据都可能泄漏，还是

.data（）

中引用的任何已删除的DOM对象都可能泄漏。但是，如果您仅使用jQuery方法从DOM中删除项（包括替换innerHTML），然后jQuery将适当地清理这些内容，并且不会出现泄漏

例如，这将导致内存泄漏：

// suppose elem is a DOM element reference

// store some data in jQuery's data storage on behalf of a DOM element
$(elem).data("someKey", "someValue");

// remove DOM element with plain Javascript
elem.parentNode.removeChild(elem);

由于您使用纯Javascript删除了DOM元素，jQuery没有机会清理您以前存储的数据。DOM元素本身将被垃圾收集，但您以前存储的

.data（）

值现在在jQuery的存储中是孤立的，本质上是一个“泄漏”因为它可能永远不会被清除。另一方面，如果您这样做：

$(elem).data("someKey", "someValue");
$(elem).remove();

然后，jQuery将看到您正在删除DOM元素，并将清除使用

.data（）

存储的数据

---

查看其工作原理的一个相当简单的方法是使用非最小化版本的jQuery创建一个两行脚本，然后在调试器中单步调用

$（elem）.data（“key”，“whatever”）

，并观察它的工作原理。

您能否用一个示例来说明您对第5段的解释？@techloris_109-添加了一个示例。