javascript - 在 DOM 中存储数据

标签 javascript performance dom custom-data-attribute

我有一个图书列表,我想存储每本书的数据,例如价格、数量、编号、分类编号、尺寸、重量等。

我正在考虑通过使用 data- 属性扩展表示列表中每本书的 li 元素,将所有这些存储在 dom 中。然后可以直接使用 javascript 使用此数据。

但是我读到访问数据属性在性能方面很慢。此外,我可以拥有同一本书的多个实例,所以我有点担心 html 中的膨胀。

另一种方法是使用 JS 对象来存储每本书的数据。

所以我的问题是在前端、DOM 或 Javscript 中存储数据的最佳实践是什么?

提前致谢

最佳答案

data- 属性通常更多地用作将数据导入 JavaScript 的方式(即从服务器端模板),而不是用于存储数据的运行时位置。最好将事件数据保存在 JavaScript 对象中,尤其是当您将在脚本的生命周期中频繁访问或操作它时。

这更符合 MVC 方法,其中数据存在于您的模型中,但可能在您的 View 中表示。出于这个原因,一些较新的 MVC 框架(如 AngularJS)提供了两者之间的自动双向绑定(bind)。

关于javascript - 在 DOM 中存储数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14308188/

相关文章:

javascript - jQuery onclick 在浏览器 Edge 中不起作用

javascript - 获取嵌入式表中最里面的行

javascript - 自动将子 div 从第一个父 div 转移到第二个父 div

sql-server - 如何加速 mssql_connect()

java - 如何使用 Java 8/Streams 在 HashMap 中找到具有某些条件的最大键?

javascript - 哪种方法用 jQuery 查找最近的后代更有效?

javascript - 如何将事件绑定(bind)到从 AJAX 请求注入(inject)的 HTML

javascript - 测试 DOM 中元素的最佳方法是什么

javascript - jQuery - AJAX 调用后,旧元素仍然存在于 DOM 中?如何去除?

javascript - SharePoint 客户端 JavaScript 文档