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

Question

Атрибуты пользовательских данных: 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"?

Answer 1

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

Answer 2

Да, они работают.

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");

Answer 3

Мало того, что IE6 не поддерживает функцию атрибутов данных HTML5, фактически фактически no текущий браузер поддерживает их! Единственным исключением на данный момент является Chrome.

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

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

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

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

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

Answer 4

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

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

Редактировать: исправил URL

Answer 5

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

Answer 6

В IE6 может не работать. Для справки: MSDN

Я предлагаю использовать jQuery для обработки большинства случаев:

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

Попробуйте это в своей кодировке.