Heim > Web-Frontend > HTML-Tutorial > Die chinesische Übersetzung der HTML-DOM-Datalist-Optionssammlung lautet „HTML-DOM-Datalist-Optionssammlung'.

Die chinesische Übersetzung der HTML-DOM-Datalist-Optionssammlung lautet „HTML-DOM-Datalist-Optionssammlung'.

WBOY
Freigeben: 2023-09-02 11:09:14
nach vorne
873 Leute haben es durchsucht

Die

HTML DOM Datalist-Optionssammlung wird verwendet, um die Sammlung der im HTML -Element vorhandenen Optionswerte festzulegen oder zurückzugeben. Elemente erscheinen in derselben Reihenfolge wie im Dokument.

Eigenschaften

Das Folgende sind die Eigenschaften der Datalist-Optionssammlung –

Property Description
Length Gibt die Anzahl der

Methoden

Das Folgende sind die Methoden der Datalist-Optionssammlung –

item(index)
Methode . Beschreibung
[Index] td> Rückkehr aus der Sammlung am angegebenen Index
Gibt das
namedItem(id) Gibt das

Syntax

Es folgt die Syntax für die Datenlisten-Optionssammlung:

datalistObject.options
Nach dem Login kopieren

Beispiel:

Sehen wir uns ein Beispiel für die Datenlisten-Optionssammlung an:

Wenn Sie auf die Schaltfläche „Zählen“ klicken (Sie können auf die Datenliste klicken, um die Anzahl der Elemente selbst zu zählen) –

HTML DOM Datalist options Collection 的中文翻译是

Wir erstellen ein Eingabefeld mit dem Attributlistenwert „Früchte“ und verknüpfen es mit „Liste“. von Daten mit derselben ID. Das bedeutet, dass die Datenliste bei der Eingabe in das Eingabefeld versucht, unseren Eingabetext mithilfe der Optionswerte zu vervollständigen. Es wird eine Datenliste mit der ID „Früchte“ mit vier Optionswerten erstellt. Die Datenliste und ihre verknüpften Eingabefelder sind alle innerhalb des Formulars vorhanden –

<!DOCTYPE html>
<html>
<body>
<h2>Datalist option elements example</h2>
<form>
<input list="fruits">
<datalist id="fruits">
<option value="Papaya">
<option value="Strawberry">
<option value="Guava">
<option value="Mango">
</datalist>
</form>
<p>Click the below button to display the number of datalist option elements</p>
<button onclick="elementNo()">COUNT</button>
<p id="Sample"></p>
<script>
   function elementNo() {
      var fLength = document.getElementById("fruits").options.length;
      document.getElementById("Sample").innerHTML = "The datalist contains " + fLength + " options";
   }
</script>
</body>
</html>
Nach dem Login kopieren

Dann erstellen wir eine Schaltfläche COUNT, die die Methode elementNo() ausführt, wenn der Benutzer darauf klickt –

<form>
<input list="fruits">
<datalist id="fruits">
<option value="Papaya">
<option value="Strawberry">
<option value="Guava">
<option value="Mango">
</datalist>
</form>
Nach dem Login kopieren
Die chinesische Übersetzung der HTML-DOM-Datalist-Optionssammlung lautet „HTML-DOM-Datalist-Optionssammlung'.elementNo()-Methode mithilfe der Methode getElementById() Ruft den Attributwert „options.length“ der Datenliste ab und weist ihn der Variablen fLength zu. Zeigen Sie dann den Optionsanzahlwert im Absatz mit der ID „Sample“ an, indem Sie dessen innerHTML-Attribut -

<button onclick="elementNo()">COUNT</button>
Nach dem Login kopieren

verwenden

Das obige ist der detaillierte Inhalt vonDie chinesische Übersetzung der HTML-DOM-Datalist-Optionssammlung lautet „HTML-DOM-Datalist-Optionssammlung'.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:tutorialspoint.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage