HTML5自定义数据属性在IE 6中工作吗?

您可以使用 getAttribute 。遵循您的示例

<div id="geoff" data-geoff="geoff de geoff">

我可以得到 data-geoff 使用

var geoff = document.getElementById("geoff");
alert(geoff.getAttribute("data-geoff"));

见 MSDN . 虽然有人提到你需要IE7才能让它正常工作,但我不久前用IE6测试过它,它运行正常(即使在怪癖模式下)。

当然,这与HTML5的特定属性无关。

是的,他们工作。

IE支持 getAttribute() 来自IE4,这是jquery内部使用的 data() .

data = elem.getAttribute( "data-" + key ); // Line 1606, jQuery.1.5.2.js

所以您可以使用jquery .data() 方法或普通的普通JavaScript:

HTML示例

<div id="some-data" data-name="Tom"></div>

javascript

var el = document.getElementById("some-data");
var name = el.getAttribute("data-name");
alert(name);

JQuery

var name = $("#some-data").data("name");

事实上,IE6不仅不支持HTML5数据属性功能 不 当前浏览器支持它们!目前唯一的例外是铬。

你完全可以自由使用 data-geoff="geoff de geoff" 作为属性,但只有当前浏览器版本的chrome才会 .dataGeoff 属性。

幸运的是, 全部的 当前浏览器(包括IE6)可以使用标准DOM引用未知属性 .getAttribute() 方法,所以 .getAttribute("data-geoff") 在任何地方都能工作。

在不久的将来,新版本的firefox和safari将开始支持数据属性,但是考虑到有一种非常好的方式可以在所有浏览器中访问它,那么就没有理由使用HTML5方法,这种方法只对您的一些访问者有效。

有关此功能的当前支持状态的详细信息,请访问 CanIUse.com .

希望有帮助。

我认为IE一直支持这个(至少从IE4开始),您可以从JS访问它们。它们被称为“Expando属性”。见 old MSDN article

通过设置expando可以禁用此行为 财产 在dom元素上为false(默认情况下为true,因此expando 属性 默认工作)。

编辑:修复了URL

如果您希望像更新的浏览器中的DataSet属性一样一次检索所有自定义数据属性,可以执行以下操作。这就是我在IE7+中所做的,并且对我很有用。

function getDataSet(node) {
    var dataset = {};
    var attrs = node.attributes;
    for (var i = 0; i < attrs.length; i++) {
        var attr = attrs.item(i);
        // make sure it is a data attribute
        if(attr.nodeName.match(new RegExp(/^data-/))) {
            // remove the 'data-' from the string 
            dataset[attr.nodeName.replace(new RegExp('^data-'), '')] = attr.nodeValue;
        }
    }
    return dataset;
}

在 IE6 可能不起作用。供参考: MSDN

我建议使用jquery处理大多数情况:

var geoff = $("#geoff").data("data-geoff");
alert(geoff);

在你的编码中试试这个。