Datensatz in HTML

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.)

HTML-Datensatz

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.

• getURL() – Diese Funktion gibt den Wert der aktuellen URL in der Datensatzfunktion Object() { [native code] } zurück.
• setURL(“URL”) – Diese Funktion gibt den Pfad zur neuen Datei an, die im Datensatz verwendet wird.
• getSourceElementID() – Ruft die ID des Seitenelements ab, auf dem der Datensatz basiert.
• setSourceElementID(“theSourceID”) – Diese Methode wird verwendet, um die ID des Datenquellenseitenelements festzulegen oder zu ändern.
• getRowSelector() gibt den aktuell verwendeten RowSelector zurück.
• setRowSelector(“theRowSelector”) Legt einen neuen RowSelector für den Datensatz fest.
• getDataSelector() – Gibt den aktuellen DataSeelctor zurück.
• setDataSelector(“theDataSelector”)-Setzt einen neuen DataSelector für den Datensatz.

Beispiele

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:

• Dem Attributnamen wird nicht mehr das Datenpräfix vorangestellt.
• Jeder Bindestrich, dem ein Kleinbuchstabe im Namen vorangeht, wird entfernt und der Buchstabe danach wird in einen Großbuchstaben umgewandelt.
• Andere Charaktere werden in Ruhe gelassen. Das bedeutet, dass jeder Bindestrich, dem kein Kleinbuchstabe folgt, gleich bleibt.

Browser-Unterstützung

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

Spezifikationen/Kommentar

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:

• Liste sei eine leere Liste von Name-Wert-Paaren.
• Fügen Sie der Liste für jedes Inhaltsattribut im zugehörigen Element der DOMStringMap ein Name-Wert-Paar hinzu, dessen erste fünf Zeichen die Zeichenfolge „data-“ sind und dessen verbleibende Zeichen (falls vorhanden) keine ASCII-Großbuchstaben enthalten Damit diese Attribute in der Attributliste des Elements aufgeführt werden.

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.

Fazit – Datensatz in HTML

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!