jquery - jQuery 循环遍历 HTML5 数据属性

Question

可能重复：
使用 javascript / jQuery 获取 data-* 属性列表

我有一系列看起来都与此类似的对象：

<a data-type="file" data-path="/some/path" data-size="849858">Link</a>

我想创建一个函数来动态提取每个数据属性，所以如果我添加类似“data-icon”或任何其他数量的属性，该函数仍会返回一个包含所有数据属性的数组，例如：

{
    "type" : "file",
    "path" : "/some/path",
    ...
}

Answer 1

编辑最初建议的答案是如果你想要 JSON 字符串/对象，我是根据你在问题中的输出字符串推断出来的。如果您只想获取键/值对，您可以简单地迭代数据属性集合。

现场演示

$.each($('a').data(), function(i, v) {
    alert('"' + i + '":"' + v + '",');
});

最初建议的答案是假设您想要 JSON 字符串/对象

您可以通过迭代数据属性集合来制作数据属性的键值对对象（json对象），使用data()它将给出数据属性的集合。生成 json 字符串后，我们可以使用 $.parseJSON 生成 JSON 对象，并使用循环从中获取键/值对。

现场演示

strJson = "{"
$.each($('a').data(), function(i, v) {
    strJson += '"' + i + '":"' + v + '",';
});
strJson = strJson.substring(0, strJson.length - 1);
strJson += '}';
var jsonObject = $.parseJSON( strJson );
for (var key in jsonObject) 
    alert(key + " : " + jsonObject[key]);