Работают ли пользовательские атрибуты данных HTML5 в IE 6?

Пользовательские атрибуты данных: http://dev.w3.org/html5/spec/Overview.html#embedding-custom-non-visible-data

Когда я говорю «работа», я имею в виду, если у меня есть HTML, как это:

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

будет следующий JavaScript:

var geoff = document.getElementById('geoff');
alert(geoff.dataGeoff);

создать в IE 6 оповещение с надписью «geoff de geoff»?

Вы можете получить значения пользовательских (или ваших собственных) атрибутов, используя 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

Таким образом, вы можете использовать .data()метод jQuery или простой ванильный 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, но фактически ни один браузер не поддерживает их! Единственным исключением на данный момент является Chrome.

Вы можете свободно использовать его data-geoff="geoff de geoff"в качестве атрибута, но только Chrome текущих версий браузера предоставит вам это .dataGeoffсвойство.

К счастью, все современные браузеры, включая IE6, могут ссылаться на неизвестные атрибуты, используя стандартный .getAttribute()метод DOM , поэтому .getAttribute("data-geoff")будут работать везде.

В самом ближайшем будущем новые версии Firefox и Safari начнут поддерживать атрибуты данных, но, учитывая, что существует совершенно хороший способ доступа к ним, который работает во всех браузерах, тогда нет никакой причины использовать метод HTML5, который будет работать только для некоторых ваших посетителей.

Вы можете узнать больше о текущем состоянии поддержки этой функции на CanIUse.com .

Надеюсь, это поможет.

Я думаю, что IE всегда поддерживал это (по крайней мере, начиная с IE4), и вы можете получить к ним доступ из JS. Они были названы «свойства экспандо». Смотрите старую статью MSDN

Это поведение можно отключить, установив для свойства expando значение false для элемента DOM (по умолчанию оно имеет значение true, поэтому свойства expando работают по умолчанию).

Изменить: исправил URL

Если вы хотите получить все пользовательские атрибуты данных одновременно, например, свойство набора данных в новых браузерах, вы можете сделать следующее. Это то, что я сделал, и отлично работает для меня в 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);

Попробуйте это в вашем коде.