HTML5-benutzerdefinierte Attribute - Warum sollte ich Sie benutzen?

Ich kann nicht scheinen, um zu verstehen, warum ich sollte glücklich sein mit HTML5 ermöglicht benutzerdefinierte Attribute? Warum sollte ich Sie benutzen?

InformationsquelleAutor der Frage Kriem | 2011-02-17

  1. 23

    Ich nehme an, Sie verweisen auf die HTML5 - [data-*] Attribute.

    Den Vorteil, dass man leicht assoziieren einige scripting-Daten (noch semantische, nicht aber für die Anzeige) mit Ihren Elementen die zimmerreserviereung, ohne das einfügen von inline-javascript alle über dem Platz, und es wird gültig HTML5. Tun die gleiche Sache in HTML4 würde erfordern die Angabe eines benutzerdefinierten namespace, und fügen Sie einige Namespace-Attribute.

    Sagen du hast eine Liste von Elementen für Verkauf, können Sie wollen, speichern Sie den numerischen Preis, ohne zu versuchen, eine Zeichenfolge zu analysieren:

    <ul>
  <li data-price="5">Item 1 is only $5 this week!</li>
  <li data-price="1">Sale on Item 2, only $1</li>
  ...
</ul>

    Wenn Sie zulassen, dass Ihre Benutzer zu markieren, eine Anzahl von verschiedenen Artikeln zu kaufen, können Sie einfach ziehen Sie den numerischen Wert für die Anzeige einer Laufenden Summe.

    Alternativ hätte man die zahlen in einer Zeitspanne mit einer bestimmten Klasse, finden Sie die richtige Spannweite auf das richtige Element, und ziehen Sie den Wert, die Art und Weise, aber [data-*] Attribute reduzieren Sie die Menge von markup/script notwendig, das gleiche zu tun.

    Wenn Sie nicht wollen, es zu benutzen, brauchen Sie nicht zu. Es gibt viele Möglichkeiten der Verknüpfung von Daten mit den Elementen, das ist nur eine neue.

    Darüber hinaus ist die neue dataset JavaScript-API bietet eine konsistente Mittel deklarativ Zugriff auf die gespeicherten Werte in [data-*] Attribute.

    JQuery-Benutzer, .Daten() und .attr() kann verwendet werden, um Zugriff [data-*] Attribute und Ich schrieb eine ausführliche Antwort, wenn Sie möchten, um zu verwenden, eine über der anderen.

    InformationsquelleAutor der Antwort zzzzBov

  2. 4

    Benutzerdefinierte Attribute sind bereits weit verbreitet, zum Beispiel hier ein Beispiel aus dojoToolkit():

    <div style="width: 350px; height: 300px">
    <div dojoType="dijit.layout.TabContainer" style="width: 100%; height: 100%;">
        <div dojoType="dijit.layout.ContentPane" title="My first tab" selected="true">
            Lorem ipsum and all around...
        </div>
        <div dojoType="dijit.layout.ContentPane" title="My second tab">
            Lorem ipsum and all around - second...
        </div>
        <div dojoType="dijit.layout.ContentPane" title="My last tab" closable="true">
            Lorem ipsum and all around - last...
        </div>
    </div>
</div>

    Könnte sich nun neu geschrieben, so dass das markup validiert unter Verwendung von Attributen wie data-dojoType. Sie ermöglichen auch das speichern von anwendungsspezifischen Daten in Ihren tags, anstatt daran herum zu hacken in das class-Attribut.

    Gibt es eine gute Einführung in die data -* - Attribute, die auf HTML5 Doctor.

    InformationsquelleAutor der Antwort robertc

  3. 4

    Mithilfe der data- benutzerdefiniertes Attribut ist Zukunftssicherheit Ihrer html5 Seite, keine Zukunft-Browser die Einhaltung der Spezifikation verwenden data-[attribute] daher nicht kollidieren Sie mit dem benutzerdefinierten Attribut.

    InformationsquelleAutor der Antwort user2971380

  4. 2

    Fand ich eine andere Verwendung für das data - Attribut:

    Könnten Sie mit den neuen HTML5 custom data- Attribut für tooltips: Semantische Tooltips Mit Reinem CSS3 und HTML5.

    InformationsquelleAutor der Antwort Kriem

Schreibe einen Kommentar