Os atributos de dados personalizados em HTML5 "funcionam" no IE 6?

Atributos de dados personalizados: http://dev.w3.org/html5/spec/Overview.html#embedding-custom-non-visible-data

Quando digo "trabalho", quero dizer, se eu tenho HTML assim:

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

será o seguinte JavaScript:

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

produzir, no IE 6, um alerta com "geoff de geoff"?

Você pode recuperar valores de atributos personalizados (ou seus) usando getAttribute. Seguindo seu exemplo com

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

Eu posso obter o valor de data-geoffusar

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

Veja MSDN . E, embora seja mencionado lá que você precisa do IE7 para fazer isso funcionar, testei isso há algum tempo com o IE6 e ele funcionou corretamente (mesmo no modo quirks).

Mas isso não tem nada a ver com atributos específicos do HTML5, é claro.

Sim, eles trabalham.

O IE suporta o getAttribute()IE4, que é o que o jQuery usa internamente data().

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

Portanto, você pode usar o .data()método jQuery ou JavaScript simples:

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

O IE6 não apenas não suporta o recurso de atributo de dados HTML5, como praticamente nenhum navegador atual os suporta! A única exceção no momento é o Chrome.

Você tem toda a liberdade de usá-lo data-geoff="geoff de geoff"como atributo, mas apenas o Chrome das versões atuais do navegador fornecerá a .dataGeoffpropriedade.

Felizmente, todos os navegadores atuais - incluindo o IE6 - podem fazer referência a atributos desconhecidos usando o .getAttribute()método DOM padrão , portanto .getAttribute("data-geoff"), funcionarão em qualquer lugar.

Em um futuro próximo, novas versões do Firefox e Safari começarão a oferecer suporte aos atributos de dados, mas, como há uma maneira perfeitamente boa de acessá-lo que funciona em todos os navegadores, não há realmente nenhuma razão para usar o método HTML5 que só funciona para alguns de seus visitantes.

Você pode ver mais sobre o estado atual de suporte para esse recurso em CanIUse.com .

Espero que ajude.

Eu acho que o IE sempre apoiou isso (pelo menos a partir do IE4) e você pode acessá-los a partir do JS. Eles foram chamados de 'propriedades expando'. Consulte o artigo antigo do MSDN

Esse comportamento pode ser desabilitado definindo a propriedade expando como false em um elemento DOM (é verdade por padrão, portanto, as propriedades expando funcionam por padrão).

Editar: corrigiu o URL

Se você deseja recuperar todos os atributos de dados personalizados de uma só vez, como a propriedade do conjunto de dados em navegadores mais recentes, faça o seguinte. Isto é o que eu fiz e funciona muito bem para mim no 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;
}

No IE6 , pode não funcionar. Para referência: MSDN

Sugiro usar o jQuery para lidar com a maioria dos casos:

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

Tente isso em sua codificação.