Javascript 向DOM节点添加属性是一种不好的做法吗?

Javascript 向DOM节点添加属性是一种不好的做法吗?,javascript,dom,Javascript,Dom,JavaScript允许您向任何对象(包括DOM节点)添加任意属性和方法。假设属性具有良好的名称空间(类似于\u myLib\u propertyName),因此不太可能产生冲突,那么有什么好的理由不将数据存储在DOM节点中吗 这样做有什么好的用例吗 我想经常这样做可能会导致一种草率的编码风格,或者导致混乱或违反直觉的代码,但似乎有时也会塞进“自定义”将属性导入DOM节点将是一种有效且方便的技术。如果您查看HTML5,字段的数据属性将允许您存储字段的信息 我认为最重要的是,不在DOM中存储数据的

JavaScript允许您向任何对象(包括DOM节点)添加任意属性和方法。假设属性具有良好的名称空间(类似于
\u myLib\u propertyName
),因此不太可能产生冲突,那么有什么好的理由不将数据存储在DOM节点中吗

这样做有什么好的用例吗


我想经常这样做可能会导致一种草率的编码风格,或者导致混乱或违反直觉的代码,但似乎有时也会塞进“自定义”将属性导入DOM节点将是一种有效且方便的技术。

如果您查看HTML5,字段的数据属性将允许您存储字段的信息

我认为最重要的是,不在DOM中存储数据的最佳理由是因为DOM是用来表示HTML页面的内容结构和样式的。虽然您当然可以以良好的名称空间方式向节点添加数据以避免冲突,但您正在将数据状态引入可视化表示中


我正试图找到一个支持或反对在DOM中存储数据的例子,并绞尽脑汁寻找一个令人信服的例子。在过去,我发现数据状态与视觉状态的分离避免了我在重新设计网站时遇到的麻烦。

不要惊讶于IE 6和7的问题。它们与setAttribute vs set as属性非常不一致

如果你不小心,你可以设置循环引用,给自己一个内存泄漏


我总是将节点属性设置为最后的手段,当我这样做时,我会格外小心地使用代码,并比平时更严格地进行测试。

不,通常在DOM节点上存储自己的属性是一个坏主意

  • DOM节点是主机对象,主机对象可以做它们喜欢做的事情。具体来说,ECMAScript规范中没有要求宿主对象允许这种扩展,因此浏览器没有义务允许这种扩展。特别是,新浏览器可能会选择不这样做,依赖它的现有代码将崩溃
  • 并非现有浏览器中的所有主机对象都允许它。例如,IE中的文本节点和所有ActiveX对象(例如用于解析XML的XMLHttpRequest和XMLDOM对象)都没有,故障行为从抛出错误到静默故障不等
  • 在IE中,可以关闭整个文档(包括文档中的所有节点)添加属性的功能,行
    document.expando=false。因此,如果页面中的任何代码包含这一行,那么依赖于向DOM节点添加属性的所有代码都将失败

至少Juriy Zaytsev认为你是这样。未来注意:2011年6月的ES 5.1阻止了你向对象添加属性。这里有一篇关于扩展DOM的帖子:谢谢你提醒我我应该已经知道的事情!独立的风格、结构和行为@亨托布的链接很好,即使作者的语法有点奇怪。我认为最能回答我问题的部分应该是“解救的包装器”。不要扩展DOM对象,而是包装它们并将自定义属性添加到包装器中。扩展DOM对象是一个比我想象的更大的跨浏览器集群f***。DOM不代表样式,它代表意义。因此,在某些情况下,这样做可能是合适的(我不推荐这样做)。请注意:并非所有DOM节点和属性都用于结构和样式设置,例如,我头脑中的
video.autoPlay=true
video.volume=0
。尽管如此,这并不包括所有JavaScript数据类型。在dom中添加属性(而不是属性)时,存储的数据是字符串。检索时,将根据其值将其转换为字符串或整数。这不是在DOM元素上启动对象或数组的可靠方法。首先,浏览器开发人员不希望打破这种想法。尤其是在这样一个竞争激烈的市场。我认为它们不会破坏宿主对象扩展。2号和3号不再是问题,因为IE在2020年就过时了。@Zortext:我同意10年来情况发生了变化:IE<11号已经过去了,我认为(尽管我现在找不到)当前的标准明确允许添加自定义属性,因此比以前更安全。尽管如此,我还是建议不要这样做。我不会说IE已经完全过时了:IE 11已经过时了,我们中的许多人仍然需要处理它。