Einführung in die Unterschiede zwischen HTML-Name, ID, Klasse (Format/Anwendungsszenario/Funktionen) usw.

Einführung in die Unterschiede zwischen HTML-Name, ID, Klasse (Format/Anwendungsszenario/Funktionen) usw.
Auf einer Seite gibt es viele Steuerelemente (Elemente oder Tags). Um die Bedienung dieser Tags zu vereinfachen, müssen diese mit einem Ausweis gekennzeichnet werden.

Die erforderlichen Attribute sind: Name, ID, Klasse

1. Name

Geben Sie einen Namen für das Tag an.

1.1 Format: <input type="text" name="benutzername" />

1.2 Anwendungsszenarien

①Formular: Name kann als Variablenname der an den Server übertragenen Formularliste verwendet werden. Der oben an den Server übertragene Name lautet beispielsweise: Benutzername = „Textwert“.

②Eingabetyp = „Radio“-Radiotag: Wenn der Name mehrerer Radiotags auf denselben Wert eingestellt ist, wird ein Radioauswahlvorgang ausgeführt.

Code kopieren
Der Code lautet wie folgt:

<input type="radio" name='sex'/>Männlich
<input type="radio" name='sex'/>Weiblich③Schnell eine Gruppe von Tags mit demselben Namen abrufen: Tags mit demselben Namen abrufen und gemeinsam Vorgänge ausführen, z. B.: Attribute ändern, Ereignisse registrieren usw.;
[Code]
Funktion changtxtcolor() {
var txts = document.getElementsByName('txtcolor'); //Alle Tags mit Name=txtcolor abrufen
for (var i = 0; i < txts.length; i++) { //Durchlaufe die Tags und ändere die Hintergrundfarbe auf Rot
txts[i].style.backgroundColor = "rot";
}
}

1.3 Funktionen

Der Wert des Namensattributs ist auf der aktuellen Seite nicht eindeutig.

2. Ich würde

Gibt die eindeutige Kennung eines Tags an.

2.1 Format: <Eingabetyp=Passwort-ID="Benutzerkennwort" />

2.2 Anwendungsszenarien:

① Erhalten Sie das Tag-Objekt schnell anhand der bereitgestellten eindeutigen ID-Nummer. Beispiel: document.getElementById(id)

② Wird als Wert des For-Attributs des Label-Tags verwendet: Beispiel: <label for='userid'>Benutzername: </label>, was bedeutet, dass beim Klicken auf dieses Label-Tag das Label mit der ID „userid“ den Fokus erhält.

2.3 Funktionen

Der Wert des ID-Attributs muss auf der aktuellen Seite eindeutig sein.

3. Klasse

Gibt den Klassennamen des Tags an.

3.1 Format: <input type=button class="btnsubmit" />

3.2 Anwendungsszenarien:

①CSS-Operation: Fügen Sie einige bestimmte Stile in eine Klasse ein und fügen Sie diese Klasse hinzu, wenn Sie Tags dieses Stils benötigen.

3.3 Funktionen:

Sie können mehrere Klassen in ein Klassenattribut einfügen, diese müssen jedoch durch Leerzeichen getrennt sein. Beispiel: class='btnsubmit btnopen'

<<:  Detaillierte Schritte zum Erweitern der LVM-Festplatte unter Linux

>>:  Der Unterschied zwischen Anzeige, Sichtbarkeit, Deckkraft, RGBA und Z-Index: -1 in CSS

Artikel empfehlen

Beispiel für die Konfiguration der Timeout-Einstellung für MySQL-Datenbanken

Inhaltsverzeichnis Vorwort 1. JDBC-Timeout-Einste...

Lösung für Ubuntu, das keine Verbindung zum Internet herstellen kann

Problembeschreibung: Ich habe einen Desktop-Compu...

In der HTML-Tabelle wird nur der äußere Rand der Tabelle angezeigt

Ich möchte eine Frage stellen. Ich habe in Dreamw...

Anfänger lernen einige HTML-Tags (3)

Verwandte Artikel: Anfänger lernen einige HTML-Ta...

Mit CSS3 implementierte Text-Popup-Effekte

Ergebnisse erzielenImplementierungscode html <...

Hinweise zum passenden MySql 8.0 und entsprechenden Treiberpaketen

MySql 8.0 entsprechendes Treiberpaket passend Nac...

JS-Code zum Erzielen eines Seitenwechseleffekts

In diesem Artikelbeispiel wird der spezifische Co...

Ein kurzes Verständnis der Unterschiede zwischen MySQL InnoDB und MyISAM

Vorwort MySQL unterstützt viele Arten von Tabelle...

So bedienen Sie Datei- und Ordnerberechtigungen unter Linux

Linux-Dateiberechtigungen Überprüfen wir zunächst...