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

Ответ 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, и он работал правильно (даже в режиме quirks).

Но это не имеет никакого отношения к атрибутам, специфичным для HTML5, конечно.

Ответ 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");

Ответ 3

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

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

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

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

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

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

Ответ 4

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

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

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

Ответ 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;
}

Ответ 6

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

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

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

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