实际上，如果您正在使用 jQuery，那么从版本开始 1.4.31.4.4（由于下面评论中提到的错误），data-*通过以下方式支持属性.data()：

从 jQuery 1.4.3 开始，HTML 5data- 属性将被自动拉入 jQuery 的数据对象。

请注意，当 JavaScript 值转换为其关联值（这包括布尔值、数字、对象、数组和 null）时，字符串保持不变。的data- 属性被拉到在第一时间中的数据属性被访问，然后不再访问或突变的（所有数据值然后被存储在内部的jQuery）。

该jQuery.fn.data函数将返回data-对象内的所有属性作为键值对，键是属性名称的一部分，data-值是按照上述规则转换后的属性值。

如果这不能说服您，我还创建了一个简单的演示：http : //jsfiddle.net/yijiang/WVfSg/

还应该提供纯 JavaScript 解决方案，因为该解决方案并不难：

var a = [].filter.call(el.attributes, function(at) { return /^data-/.test(at.name); });

这给出了一个属性对象数组，它们具有name和value属性：

if (a.length) {
    var firstAttributeName = a[0].name;
    var firstAttributeValue = a[0].value;
}

编辑：更进一步，您可以通过迭代属性并填充数据对象来获取字典：

var data = {};
[].forEach.call(el.attributes, function(attr) {
    if (/^data-/.test(attr.name)) {
        var camelCaseName = attr.name.substr(5).replace(/-(.)/g, function ($0, $1) {
            return $1.toUpperCase();
        });
        data[camelCaseName] = attr.value;
    }
});

然后，您可以访问例如data-my-value="2"as的值data.myValue；

jsfiddle.net/3KFYf/33

编辑：如果您想从对象以编程方式在元素上设置数据属性，您可以：

Object.keys(data).forEach(function(key) {
    var attrName = "data-" + key.replace(/[A-Z]/g, function($0) {
        return "-" + $0.toLowerCase();
    });
    el.setAttribute(attrName, data[key]);
});

jsfiddle.net/3KFYf/34

编辑：如果你使用 babel 或 TypeScript，或者只为 es6 浏览器编码，这是一个使用 es6 箭头函数的好地方，并稍微缩短代码：

var a = [].filter.call(el.attributes, at => /^data-/.test(at.name));

看看这里：

如果浏览器也支持 HTML5 JavaScript API，您应该能够通过以下方式获取数据：

var attributes = element.dataset

或者

var cat = element.dataset.cat

哦，但我也读到：

不幸的是，新的数据集属性尚未在任何浏览器中实现，因此在此期间最好使用getAttribute并setAttribute如前文所述。

这是从 2010 年 5 月开始的。

如果您无论如何都使用 jQuery，您可能需要查看customdata插件。我没有这方面的经验。

如上所述，现代浏览器具有HTMLElement.dataset API。
该 API 为您提供DOMStringMap，您data-*只需执行以下操作即可检索属性列表：

var dataset = el.dataset; // as you asked in the question

您还可以使用data-属性的键名检索数组，例如

var data = Object.keys(el.dataset);

或映射其值

Object.keys(el.dataset).map(function(key){ return el.dataset[key];});
// or the ES6 way: Object.keys(el.dataset).map(key=>{ return el.dataset[key];});

像这样，您可以迭代它们并使用它们，而无需像我们之前需要的那样在元素的所有属性之间进行过滤。

或 convertgilly3对 jQuery 方法的出色回答：

$.fn.info = function () {
    var data = {};
    [].forEach.call(this.get(0).attributes, function (attr) {
        if (/^data-/.test(attr.name)) {
            var camelCaseName = attr.name.substr(5).replace(/-(.)/g, function ($0, $1) {
                return $1.toUpperCase();
            });
            data[camelCaseName] = attr.value;
        }
    });
    return data;
}

使用：$('.foo').info();