javascript - 将 DOM 节点链接到(浏览器内)域对象 : is direct reference OK? 的选项

标签 javascript dom

对于单页应用程序:我希望我的每个 DOM 节点都具有对单个(浏览器内)域对象的引用。像这样存储直接引用是否可以:

var myDomainObject = ...;
var DOMNode = document.getElementById("myId");
DOMNode.domain_object = myDomainObject;

这安全、可重复吗?浏览器可以使用附加的 JavaScript 属性做神秘的事情吗?

谢谢。

最佳答案

从经验的 Angular 来看:我已经毫无问题地将数据直接附加到节点,而且从来没有出现过问题。从规范的 Angular 来看,我的解释是这样做不一定是推荐的,但在自定义属性不与其他任何内容发生冲突的情况下是安全的。

Common Infrastructure - Extensibility ,对作者(也就是你)的建议是仅使用 [data-*] 属性:

Authors can include data for inline client-side scripts or server-side site-wide scripts to process using the data-*="" attributes. These are guaranteed to never be touched by browsers, and allow scripts to include data on HTML elements that scripts can then look for and process.

有效用户代理的要求是在 DOM 中保留它无法识别的任何内容。

User agents must treat elements and attributes that they do not understand as semantically neutral; leaving them in the DOM (for DOM processors), and styling them according to CSS (for CSS processors), but not inferring any meaning from them.

因此,根据 W3C 避免冲突的目标,我的建议是创建引用 DOM 元素的对象。但是,如果您“必须”将奇怪的东西标记到 DOM 上,请放心,用户代理需要将其留在那里。但是,如果您确实需要,使用那些 data-* 属性可能是明智的!

(我个人不使用它们,并且倾向于将对象和值添加到当时最方便的任何东西上。但是,我可能会对大约 15 年的黑客攻击和“功能检测”感到厌倦用户代理。即使是现在,我也不认为 IE 支持 data-* 标准 ... )

关于javascript - 将 DOM 节点链接到(浏览器内)域对象 : is direct reference OK? 的选项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16782752/

相关文章:

javascript - 使用操作表返回 promise

javascript - 如何将 60 个相似的 jquery 函数组合成一个函数?

javascript - DOM manip 被*之后*调用的长时间运行的函数阻塞?

java - 我可以在 Java 中使用 for-each 遍历 NodeList 吗?

javascript - 如何将 "k%C3%B6nnen"转换为 können"

javascript - jQuery `map` 将数组转换为 `dom` 元素

javascript - 覆盖现有的 JavaScript Array.prototype 方法会导致无限递归?

php - 如何通过 HTML 中的按钮或链接发布到 2 个页面?

javascript - 如何在sharepoint列的href中调用javascript

javascript - 浏览器是否原生优化连续批量 dom 更新?