javascript - 向 DOM Element 对象添加属性有什么问题?

标签 javascript dom object

我一直在寻找一个直接的答案(我能想到很多可能性,但我想知道真正的原因):

jQuery 提供了一个 .data() 方法来将数据与 DOM Element 对象关联起来。是什么使得这有必要?直接向 DOM 元素对象添加属性(或方法)是否存在问题?它是什么?

最佳答案

Is there a problem adding properties (or methods) directly to DOM Element Objects?

有可能。

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

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

任意属性存在一个实际问题,因为您真的不知道您选择的任意名称在您尚未测试的某些浏览器中没有现有含义,或者在尚不存在的浏览器或标准的 future 版本中。添加属性 element.sausage= true ,并且您无法确定在空间和时间的任何地方没有任何浏览器会使用它作为信号来启用令人兴奋的 DOM Sausage 让浏览器崩溃功能。因此,如果您确实添加任意属性,请确保为其指定一个不太可能的名称,例如 element._mylibraryname_sausage= true 。这还有助于防止命名空间与可能添加任意属性的其他脚本组件发生冲突。

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

(请注意,这只发生在值为简单类型的属性上;对象、数组和函数不会显示在序列化 HTML 中。我希望 jQuery 知道这一点,因为它围绕它实现 data 方法的方式绝对很糟糕,会导致错误,并减慢许多简单的 DOM 操作。)

关于javascript - 向 DOM Element 对象添加属性有什么问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1915341/

相关文章:

javascript - 从 MVC Helper 生成的文本框中调用 JavaScript 函数

javascript - jquery:SyntaxError: 未终止的字符串文字

javascript - jQuery .on() 方法在 Chrome 中不起作用(但在 IE 和 FF 中起作用)

C++ 对象引用未设置为对象的实例

php - ORM 类的对象无法使用 Idiorm 转换为字符串

.net - 反序列化 XML 文件中的注释

javascript - 如何通过在 google apps 脚本中使用 Gsheet 文件的名称来获取 Gsheet 文件的 ID

javascript - 使用 jQuery 选择和编辑此脚本中的嵌套值

javascript - 如果我在 body 标签的末尾放置一个脚本标签,我应该等待 DOMContentLoaded 事件吗

python - 使用 Python 以 minidom 获取元素值