在DOM中正确存储数据的方法是什么？

Question

8

最近我一直在使用标题标签在各种HTML元素中存储JSON格式的数据到DOM中。

这是一种不好的方法（我认为是这样的）吗？有没有正确的方法可以与jQuery很好地配合使用？所谓“很好地配合使用”是指

$("myButton").click(function (e) {
     var myData;
     eval("myData=" + $(this).attr("title"));
});

这个方法运行良好，但我想知道是否有更好的方法？

顺便问一下，HTML元素的标题标签实际上是如何工作的？我找不到它实际上在哪里被使用了？

还可以得到基于jQuery和非jQuery的响应吗？（抱歉有点挑剔）

- Maxim Gershkovich

4个回答

8

在您的示例中，我建议采取以下措施，这不会使您面临“eval”安全风险：

myData = JSON.decode($(this).attr("title"));

通常这是一种保存非安全数据的有效方法。您还有其他选项：

使用 JQuery 的 .data() 方法：

myData = $this.data("foo");
在 HTML5 中，现在可以将自定义数据属性（例如“”）作为任何元素的属性使用。 http://html5doctor.com/html5-custom-data-attributes/
如果您知道可用性，可以使用本地存储。 http://dev.w3.org/html5/webstorage/
您可以在 Jquery 之上使用 Backbone.js，以提供更抽象处理模型数据的方式。 http://documentcloud.github.com/backbone/

- stef

4

使用jquery data()

jQuery.data()方法允许我们以一种安全的方式将任何类型的数据附加到DOM元素上，避免循环引用，因此不会出现内存泄漏。jQuery确保在通过jQuery方法删除DOM元素和用户离开页面时删除数据。我们可以为单个元素设置多个不同的值，并稍后检索它们：

jQuery.data(document.body, 'foo', 52);

- Haim Evgi

0

在jQuery世界中，通常认为使用元数据插件是最佳实践，因为它是官方的jQuery插件，还支持HTML5数据属性。如需更多信息，请查看http://docs.jquery.com/Plugins/Metadata/metadata。

- Krishna Chytanya

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- jAndy · Accepted Answer

eval("myData=" + $(this).attr("title"));

这几乎是打你的合法理由！(开个玩笑)

你应该使用自己的命名空间对象来存储数据"全局"。在这种情况下，全局仅意味着应用程序代码中的全局，而不是使用global object(在浏览器中为window)。

var my_application = {};

$('myButton').click(function() {
  my_application.myData = $(this).attr('title');
});

当然，这只是一种非常基本的策略。在您的特定情况下，您还可以使用jQuery的.data()方法将数据附加到DOM节点上。

$('myButton').click(function() {
   $.data(this, 'myData', this.title);
});