Gli attributi dei dati personalizzati HTML5 “funzionano” in IE 6?

Attributi dei dati personalizzati: http://dev.w3.org/html5/spec/Overview.html#embedding-custom-non-visible-data

Quando dico “lavoro”, voglio dire, se ho HTML come questo:

sarà il seguente JavaScript:

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

produrre, in IE 6, un avviso con “geoff de geoff” in esso?

È ansible recuperare i valori degli attributi personalizzati (o propri) utilizzando getAttribute . Seguendo il tuo esempio con

 

Posso ottenere il valore di data-geoff usando

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

Vedi MSDN . E sebbene sia stato detto che hai bisogno di IE7 per farlo funzionare, l’ho provato qualche tempo fa con IE6 e funzionava correttamente (anche in modalità Quirks).

Ma questo non ha nulla a che fare con gli attributi specifici di HTML5, ovviamente.

Sì, funzionano.

IE ha supportato getAttribute() da IE4 che è ciò che jQuery usa internamente per data() .

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

Quindi puoi utilizzare il metodo .data() di jQuery o JavaScript semplice di vanilla:

HTML di esempio

 

Javascript

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

jQuery

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

Non solo IE6 non supporta la funzionalità Attributo dati HTML5, in realtà praticamente nessun browser attuale li supporta! L’unica eccezione al momento è Chrome.

Sei perfettamente libero di utilizzare data-geoff="geoff de geoff" come attributo, ma solo Chrome delle attuali versioni del browser ti darà la proprietà .dataGeoff .

Fortunatamente, tutti i browser correnti, incluso IE6, possono fare riferimento a attributi sconosciuti utilizzando il metodo DOM .getAttribute() standard, quindi .getAttribute("data-geoff") funzionerà ovunque.

Nel prossimo futuro, le nuove versioni di Firefox e Safari inizieranno a supportare gli attributi dei dati, ma dato che c’è un ottimo modo per accedervi che funziona con tutti i browser, non c’è davvero alcun motivo per utilizzare il metodo HTML5 che funziona solo per alcuni dei tuoi visitatori.

Puoi vedere di più sullo stato attuale del supporto per questa funzione su CanIUse.com .

Spero possa aiutare.

Penso che IE abbia sempre supportato questo (almeno partendo da IE4) e puoi accedervi da JS. Erano chiamati “expando properties”. Vedi il vecchio articolo MSDN

Questo comportamento può essere disabilitato impostando la proprietà expando su false su un elemento DOM (è true per impostazione predefinita, quindi le proprietà expando funzionano per impostazione predefinita).

Modifica: risolto l’URL

Se si desidera recuperare tutti gli attributi dei dati personalizzati contemporaneamente come la proprietà del set di dati nei nuovi browser, è ansible eseguire quanto segue. Questo è quello che ho fatto e funziona perfettamente per me in 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; } 

In IE6 , potrebbe non funzionare. Per riferimento: MSDN

Suggerisco di usare jQuery per gestire la maggior parte dei casi:

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

Prova questo nel tuo codice.