Dataset-Eigenschaft kann verwendet werden, um Datenattribute einfacher abzurufen. Für jedes benutzerdefinierte Datenattribut gibt diese Eigenschaft ein DOMStringMap-Objekt mit nur einem Eintrag zurück. Das schreibgeschützte Datensatzkonzept der HTML-Element-Schnittstelle gibt uns die Möglichkeit, Lese-/Schreibzugriff auf benutzerdefinierte Datenattribute (data-*) für die angegebenen Elemente zu erhalten. Es bietet eine String-Map (DOMStringMap), die einen Eintrag für jede data-*-Eigenschaft hat. Der Datensatz ist sowohl in DOM als auch in HTML verfügbar.
Syntax:
Die Syntax ist deklariert als
element.dataset.key
Dies ist die minimale Erstellung eines Datensatzes.
HTML-Datensätze ermöglichen Benutzern den Zugriff auf Daten über herkömmliche HTML-Tabellen und andere strukturierte Markups. HTML-Datensätze funktionieren ähnlich wie XML-Datensätze, mit der Ausnahme, dass sie die Millionen bereits vorhandener Tabellen nutzen können! Der HTML-Datensatz war eine offensichtliche Erweiterung, da wir XML in eine Tabellenstruktur verflachen. Der Datensatz ist eine native Eigenschaft eines Elements, das die Datenattribute enthält; Es wird in IE11+ und Chrome 8+ kaum unterstützt. Datensatzelementwerte sind normalerweise Zeichenfolgen, obwohl data() von jQuery die von bereitgestellten Typen berücksichtigt. Daten (Schlüssel, Wert). (Dataset gibt DOMStringMap zurück, während data() in jQuery ein jQuery-Objekt zurückgibt.)
Benutzer können normale HTML-Tabellen und ein anderes strukturiertes Markup als Datenquellen mit dem Spry-HTML-Datensatz verwenden. HTML-Datensätze funktionieren ähnlich wie XML-Datensätze, mit der Ausnahme, dass sie die Millionen verfügbarer Tabellen nutzen können. Der HTML-Datensatz war eine natürliche Erweiterung des Spry Frameworks, da wir XML in eine Tabellenstruktur verflachen.
Der HTML-Datensatz enthält eine Reihe von Dienstprogrammen, mit denen Sie ihn ändern können.
Für einen gültigen HTML-Code
<li class="prod" data-name="Dove Shampoo" data-country="Oslo" data-lang="js" data-types="Hair"> <b>Hello Users:</b> <span>A newly launched Items</span> </li> var u1 = document.getElementsByTagName("li")[0]; var p1 = 0, span = user.getElementsByTagName("span")[0]; var content = [ {name: "country", prefix: "Product exported "}, {name: "type", prefix: "utilizing on hair "}, {name: "lang", prefix: "hello Oslo "} ]; u1.addEventListener("click", function(){ var content = content [ pos++ ]; span.innerHTML = content.prefix + u1.dataset[ content.name ]; }, false);
Im obigen Codeausschnitt funktioniert die Dataset-Eigenschaft genauso wie eine Attributeigenschaft. Dieser Code könnte durch Präfixe wie Inhaltspräfixe angereichert werden, die in Zukunft besser funktionieren. Der Schlüssel kann wie im Element als Objekteigenschaft des Datensatzes verwendet werden, um Attribute festzulegen und zu lesen. dataset.key-Name. Die Klammersyntax für Objekteigenschaften kann auch zum Festlegen und Lesen von Attributen verwendet werden, wie im Element. Datensatz[Schlüsselname]. Der in-Operator kann verwendet werden, um zu sehen, ob ein Attribut vorhanden ist.
Das Datensatz-IDL-Attribut bietet einfache Zugriffsmöglichkeiten für alle data-*-Attribute eines Elements (data-*/a>). Abrufen des Datensatzes (dataset/a>) Das IDL-Attribut muss ein DOMStringMap-Objekt zurückgeben, das den folgenden Algorithmen zugeordnet ist, die diese Attribute in ihrem Element verfügbar machen:
<ahref="demo.html#domstringmap-0"> </a>
Einige Dinge, die es zu beachten gilt:
Der Datensatz ist nicht mit allen Browsern kompatibel (insbesondere mit früheren Versionen von Internet Explorer). Sehen wir uns die aktualisierten Kompatibilitätsdaten in einer Tabelle an:
Support | Versions | |||
Desktop | Chrome | Edge | Firefox | Internet Explorer |
6 and 8 | Yes | 6 higher | 9 | |
Mobile | Android | Edge | Opera | Samsung |
6 | Yes | Nil | Nil |
In HTML5 wurden einige Dinge geändert, um die Entwicklung einer auf Standards basierenden Homepage noch einfacher zu machen, und das sollte einen großen Unterschied machen. Da die Lernkurve und die Fehlerquote von einfach XML-basiertem Markup zu hoch sind, wurde das Datenattribut als Möglichkeit zur Anwendung dieses Ansatzes erstellt. Es ist wichtig zu verstehen, dass Datenattribute nicht versuchen, Namespaces oder irgendetwas anderes zu ersetzen. Sie stellen die Tools zur Verfügung, die zur *Bereitstellung* der oben beschriebenen Funktionalität erforderlich sind. Man kann Datenattribute in HTML verwenden, um RDFa, anspruchsvolle Formate und sogar eine Art Namensraum zu erreichen. Der attraktivste Aspekt dieser Spezifikation besteht darin, dass Benutzer nicht darauf warten müssen, dass ein Browser sie implementiert, bis sie sie verwenden können. Wir können sicher sein, dass es auch in Zukunft funktionieren wird, wenn Benutzer heute beginnen, Datenpräfixe für die HTML-Metadaten zu verwenden.
Führen Sie den folgenden Algorithmus aus, um die Name-Wert-Paare einer DOMStringMap abzurufen:
Für einen einfachen HTML-Standard – Der Bewertungskommentar ist keine genaue Änderung gegenüber dem neuesten HTML 5.1
Version HTML 5 –Bewertungskommentar (Keine Änderung im vorherigen Standard)
Version HTML 5.1 –Keine Auswirkungen von HTML 5.
Schließlich sind benutzerdefinierte Datenattribute eine praktische Möglichkeit, Anwendungsdaten auf Webseiten zu speichern. Mit HTML5 können wir jetzt benutzerdefinierte Datenattribute in alle HTML-Komponenten integrieren. Bis zur Einführung dieser Attribute bestand der einzige Schlüssel zum Erreichen eines ähnlichen Ergebnisses (Zuordnen von Daten zu Elementen) in der Verwendung von CSS-Klassen in den Elementen.
Das obige ist der detaillierte Inhalt vonDatensatz in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!