使用 jQuery 存储数据有优势吗？

我知道更多关于 jQuery 如何存储数据的信息。

执行其中一项或另一项是否有任何优势：

$('#editCity').data('href', "xx");
var a = $('#editCity').data('href');

or

$('#editCity').attr('data-href', "xx");
var a = $('#editCity').attr('data-href');

还有一个相关问题。

如果我有这个：

var modal = { x: 'xx', y: 'yy' };

我也可以使用 .data( .. ) 存储它吗？

直接在 DOM 元素上存储属性值是有风险的，因为可能会发生内存泄漏。如果你无论如何都在使用 jQuery，.data()机制是一种跟踪每个元素信息的奇妙而安全的方法。它也允许存储任意 JavaScript 数据结构，而不仅仅是字符串。

edit— 当您的 HTML 标记包含data-foo属性，当访问键时会隐式读取这些属性。也就是说，如果您的 HTML 如下所示：

<div id="div1" data-purpose="container">

然后在 jQuery 中：

alert( $('#div1').data('purpose') ); // alerts "container"

此外，jQuery还会对属性值进行一些“智能”分析。如果一个值看起来像一个数字，jQuery 将返回一个数字，而不是字符串。如果它看起来像 JSON，它会为您反序列化 JSON。

edit— 这里有一个好技巧：在 Chrome 开发者控制台（“控制台”视图）中，您可以键入 JavaScript 表达式并对其进行求值。评估始终在您正在处理的页面的上下文中完成。如果您从“元素”视图中选择一个元素，则在控制台中 JavaScript 符号$0将引用所选的 DOM 元素。因此，您始终可以通过转到控制台并键入以下内容来检查元素的“数据”映射：

$($0).data("something");

The .data()函数，如果不带参数调用，则返回all键/值对：

$($0).data();