向DOM Element对象添加属性有什么问题？

Question

我一直在寻找一个直接的答案（我可以想到很多可能性，但我想知道真正的原因）：

jQuery提供了一个.data（）方法，用于将数据与DOM Element对象相关联。是什么让这有必要？将属性（或方法）直接添加到DOM元素对象是否有问题？它是什么？

Answer 1

  

将属性（或方法）直接添加到DOM元素对象是否有问题？

潜在

没有Web标准说您可以向DOM节点添加任意属性。它们是具有浏览器特定实现的“主机对象”，而不是“本机JavaScript对象”，根据ECMA-262，您可以执行您喜欢的操作。其他主机对象不允许您添加任意属性。

实际上，因为最早的浏览器确实允许你这样做，所以你无论如何都是事实上的标准......除非你通过设置document.expando= false故意告诉IE禁止它。您可能不会自己这样做，但如果您正在编写要在其他地方部署的脚本，则可能会让您感到担忧。

任意属性存在实际问题，因为您确实知道您选择的任意名称在某些尚未测试的浏览器中没有现有含义，或者尚未存在的浏览器或标准的未来版本。添加一个属性element.sausage= true，您无法确定任何时间空间和时间的浏览器都不会将其用作信号来吸引令人兴奋的DOM Sausage Make The Browser Crash功能。因此，如果您确实添加了任意属性，请确保为其命名，例如element._mylibraryname_sausage= true。这也有助于防止命名空间与可能添加任意属性的其他脚本组件发生冲突。

IE中还存在一个问题，即您添加的属性被错误地视为属性。如果使用innerHTML序列化元素，则会在输出中获得意外属性，例如。 <p _mylibraryname_sausage="true">。如果您将该HTML字符串分配给另一个元素，您将在新元素中获得一个属性，可能会使您的脚本混乱。

（注意这只适用于值为简单类型的属性;对象，数组和函数不会出现在序列化HTML中。我希望jQuery知道这一点，因为它围绕它实现{{1}的方式方法非常糟糕，导致错误，并减慢许多简单的DOM操作。）

Answer 2

我认为您可以添加所需的所有属性，只要您自己只需要使用它们，并且该属性不是方法或包含方法的某个对象。这有什么问题，方法可能会在浏览器中造成内存泄漏。特别是当你在这样的方法中使用closures时，浏览器可能无法完成垃圾清理，这会导致内存的分散和平被占用。

This link很好地解释了。

here您将找到几种常见内存泄漏模式的描述

Answer 3

这与IE中的DOM不由JScript管理这一事实有关，这使得它完全不同于访问环境。这会导致内存泄漏http://www.crockford.com/javascript/memory/leak.html。另一个原因是，当人们使用innerHTML复制节点时，所有这些添加的属性都不会被转移。