Haben HTML5 benutzerdefinierte Daten „Arbeit“ in IE 6 Attribute?

Question

Benutzerdefinierte Daten: http: // dev.w3.org/html5/spec/Overview.html#embedding-custom-non-visible-data

Als ich „Arbeit“ sage, meine ich, wenn ich HTML wie diese haben:

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

wird die folgende JavaScript:

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

produzieren, in IE 6, wird eine Warnung mit „geoff de geoff“ drin?

Answer 1

Sie können Werte von benutzerdefinierten abrufen (oder eigene) Attribute mit getAttribute. Nach Ihrem Beispiel mit

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

Ich kann den Wert von data-geoff erhalten mit

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

Siehe MSDN . Und obwohl es dort erwähnt, dass Sie IE7 müssen dies an der Arbeit, die ich getestet dies vor einer Weile mit IE6 und es funktionierte richtig (auch im Quirks-Modus).

Das hat aber nichts mit HTML5-spezifischen Attributen zu tun, natürlich.

Answer 2

Ja, sie arbeiten.

IE hat getAttribute() von IE4 unterstützt das ist, was jQuery intern verwendet für data().

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

So können Sie entweder jQuery .data() Methode oder Plain-Vanilla-JavaScript verwenden:

Beispiel-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

Nicht nur, dass IE6 nicht die HTML5-Daten unterstützt Features Attribut in der Tat praktisch nicht aktuelle Browser unterstützt sie! Die einzige Ausnahme ist im Moment Chrome.

Sie sind vollkommen frei data-geoff="geoff de geoff" als Attribut zu verwenden, aber nur Chrome der aktuellen Browser-Versionen erhalten Sie die .dataGeoff Eigenschaft geben.

Zum Glück, alle aktuelle Browser - einschließlich IE6 -. Kann unbekannte Attribute verweist auf die Standard-DOM .getAttribute() Methode verwendet, so .getAttribute("data-geoff") wird überall funktionieren

In naher Zukunft werden neue Versionen von Firefox und Safari startet die Datenattribute zu unterstützen, aber wenn man bedenkt, dass es eine ganz gute Möglichkeit, es zu accessessing, die in allen Browsern funktioniert, dann gibt es wirklich keinen Grund, die HTML5 zu verwenden Verfahren, die für einige Ihrer Besucher nur funktionieren wird.

Sie können mehr über den aktuellen Stand der Unterstützung sehen für diese Funktion unter CanIUse.com .

Ich hoffe, das hilft.

Answer 4

Ich denke, IE hat immer diese unterstützt (zumindest von IE4 beginnen) und Sie können sie von JS zugreifen. Sie wurden ‚expando Eigenschaften‘ genannt. Siehe alten MSDN-Artikel

Dieses Verhalten kann durch Setzen der expando Eigenschaft auf false auf einem DOM-Element deaktiviert werden (es ist wahr standardmäßig so die expando Eigenschaften Arbeit Standard).

Edit: die URL festgelegt

Answer 5

Wenn Sie alle der benutzerdefinierten Datenattribute auf einmal wie die Dataset-Eigenschaften in neueren Browsern abrufen möchten, können Sie die folgenden Aktionen aus. Das ist, was ich tat und funktioniert gut für mich 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;
}

Answer 6

IE6 , es nicht funktionieren kann. Als Referenz: MSDN

Ich schlage vor, mit jQuery den meisten Fällen behandeln:

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

Versuchen Sie dies in Ihrer Codierung.