So ändern Sie den Wert des Attributs eines HTML -Elements in JavaScript
Webseiten werden mit mehreren Programmiersprachen entwickelt. Zwei solcher Webprogrammiersprachen sind HTML und JavaScript. HTML ist eine Websprache, mit der die Grundstruktur von Webseiten erstellt wird. Inzwischen wird JavaScript verwendet, um dynamische Inhalte in die Webseiten einzubeziehen, um sie faszinierend zu machen. Beide haben unterschiedliche Unterscheidungsmerkmale, die sie hervorheben lassen. Eine solche Funktion ist HTML DOM. HTML DOM, das für das Dokumentobjektmodell kurz ist, ermöglicht JavaScript, den Inhalt von HTML -Elementen zu ändern.
Zum Zwecke der Änderung des Attributwerts eines HTML -Elements mit JavaScript bietet HTML DOM mehrere Methoden. Mit diesen Methoden können Sie den Attributwert eines HTML -Elements auf folgende Weise ändern:
- Verwendung von GetAtTribute () -Methode
- Verwenden der Methode setAttribute ()
Lassen Sie uns jeden von diesen ausführlich besprechen.
Attribut erhalten
Wie der Name vorschlägt, besteht die Methode von GetAttribute () darin, den aktuellen Wert des Attributs zu extrahieren. Die Syntax der GetAtTribute () -Methode ist wie folgt.
Syntax der GetAtTribute () -Methode
Element.getAttribute (Attributename);Lassen Sie uns ein Beispiel zum weiteren Verständnis sehen.
Beispiel
Angenommen, Sie möchten den SRC -Attributwert des Elements ändern.
Der obige Code zeigt ein Naturbild.
Jetzt möchten wir dieses Hundebild in ein Katzenbild ändern. Wir verwenden den folgenden Code.
Das vollständige Beispiel mit Ausgang ist unten gezeigt.
Das Naturbild wird in Schneebild geändert
Setzen Sie das Attribut
Um ein Attribut für ein bestimmtes Element festzulegen, verwenden wir die Methode setAttribute (). Es aktualisiert den Wert eines in einem Element vorhandenen Attribut. Die Syntax dieser Methode ist wie folgt.
Syntax der setAttribute () -Methode
Element.setAttribute (Attributename, AttributeValue);Lassen Sie uns ein Beispiel sehen, um die Methode besser zu verstehen.
Beispiel:
Zuerst erstellen wir eine einfache Schaltfläche mit einer Beschriftung von "HIER -Klicken".
Jetzt müssen wir das Element auswählen, und das werden wir mit seiner ID tun.
var btn = dokument.GetElementById ("myBtn");Jetzt werden wir die Methode setAttribute () verwenden, um neue Attribute festzulegen.
Btn.setAttribute ("Klasse", "Click-Btn");Btn.setAttribute ("enable", "");
Der vollständige Code zusammen mit der Ausgabe ist unten angezeigt.
Abschluss
Um den Attributwert eines HTML -Elements HTML DOM zu ändern, enthält zwei Methoden, die GetAttribute () und setAttribute () sind. Der GetAtTribute () wird verwendet, um den aktuellen Wert des Attributs zu extrahieren, während setAttribute () verwendet wird, um den Wert des Attributs zu ändern. In diesem Tutorial werden beide Methoden zusammen mit geeigneten Beispielen ausführlich erörtert.