Attribute wurden kurz in Übersicht über HTML behandelt. Sehen wir uns das mal genauer an.
Attribute machen HTML so leistungsstark. Attribute sind durch Leerzeichen getrennte Namen und Name/Wert-Paare, die im öffnenden Tag enthalten sind und Informationen zum Element sowie Funktionen für das Element bereitstellen.
Attribute definieren das Verhalten, die Verknüpfungen und die Funktionalität von Elementen. Einige Attribute sind global, d. h., sie können im öffnenden Tag eines beliebigen Elements vorkommen. Andere Attribute gelten für mehrere, aber nicht alle Elemente, während wieder andere elementspezifisch sind und nur für ein einzelnes Element relevant sind. In HTML benötigen alle Attribute außer booleschen und in gewissem Maße aufgezählten Attributen einen Wert.
Wenn ein Attributwert ein Leerzeichen oder Sonderzeichen enthält, muss der Wert in Anführungszeichen gesetzt werden. Aus diesem Grund und zur besseren Lesbarkeit sind Zitate immer empfehlenswert.
Bei HTML wird die Groß- und Kleinschreibung nicht berücksichtigt, bei einigen Attributwerten jedoch schon. Bei Werten, die Teil der HTML-Spezifikation sind, wird die Groß-/Kleinschreibung nicht berücksichtigt. Bei definierten Stringwerten wie Klassen- und ID-Namen wird die Groß- und Kleinschreibung berücksichtigt. Wenn ein Attributwert in HTML die Groß- und Kleinschreibung berücksichtigt, ist dies auch der Fall, wenn er als Attributselektor in CSS und in JavaScript verwendet wird. Andernfalls wird die Groß- und Kleinschreibung nicht berücksichtigt.
<!-- the type attribute is case insensitive: these are equivalent -->
<input type="text">
<input type="TeXt">
<!-- the ID attribute is case sensitive: they are not equivalent -->
<div id="myId">
<div id="MyID">
Boolesche Attribute
Wenn ein boolesches Attribut vorhanden ist, ist es immer „true“. Boolesche Attribute sind autofocus, inert, checked, disabled, required, reversed, allowfullscreen, default,, loop, autoplay, controls, muted, readonly, multiple, und selected.
Wenn eines (oder mehrere) dieser Attribute vorhanden ist, ist das Element deaktiviert, erforderlich, schreibgeschützt usw. Wenn nicht, ist es das nicht.
Boolesche Werte können entweder weggelassen, auf einen leeren String gesetzt oder der Name des Attributs sein. Der Wert muss jedoch nicht auf den String true gesetzt werden. Alle Werte, einschließlich true, false und 😀, werden als „wahr“ ausgewertet, auch wenn sie ungültig sind.
Diese drei Tags sind gleichwertig:
<input required>
<input required="">
<input required="required">
Wenn der Attributwert „false“ ist, lassen Sie das Attribut weg. Wenn das Attribut „true“ ist, fügen Sie es ein, geben Sie aber keinen Wert an.
required="required" ist beispielsweise kein gültiger Wert in HTML. Da required jedoch ein boolescher Wert ist, werden ungültige Werte in „true“ aufgelöst.
Da ungültige Aufzählungsattribute jedoch nicht unbedingt denselben Wert wie fehlende Werte haben, ist es einfacher, sich anzugewöhnen, Werte wegzulassen, als sich zu merken, welche Attribute boolesch und welche aufgezählt sind und möglicherweise einen ungültigen Wert anzugeben.
Wenn Sie zwischen „true“ und „false“ wechseln, sollten Sie das Attribut mit JavaScript hinzufügen und entfernen, anstatt den Wert zu ändern.
const myMedia = document.getElementById("mediaFile");
myMedia.removeAttribute("muted");
myMedia.setAttribute(