So fügen Sie das Readonly -Attribut in JavaScript hinzu und entfernen Sie

In JavaScript gibt es Webseiten, auf denen Sie sensible Daten eingeben müssen, die nicht nach der Eingabe oder beim Senden eines Formulars geändert werden sollten. Zum Beispiel die Festlegung der Dateiberechtigungen so lesbar oder nicht. In solchen Fällen ist das Hinzufügen und Entfernen von Readonly -Attributen in JavaScript bei der Dateibehandlung sehr effektiv und sicherzustellen.

In diesem Artikel werden die Methode zum Hinzufügen und Entfernen eines Readonly-Attributs in JavaScript diskutiert.

So fügen Sie das Readonly -Attribut in JavaScript hinzu und entfernen Sie?

Um ein readonly -Attribut in JavaScript hinzuzufügen und zu entfernen, wenden Sie die “ansetAttribute ()" Und "removeTtribute ()”Methoden.

Der "setAttribute ()Die Methode weist einem Attribut einen Wert zu und die “removeTtribute ()Die Methode entfernt ein Attribut aus dem angegebenen Element. Diese Methoden können mit einem verbunden seinklickenEreignis, um den angegebenen Wert als "festzustellen"schreibgeschütztUnd beschränken die Entfernung.

Syntax

Element.setAttribute (Name, Wert)

In der obigen Syntax “,“Name”Bezieht sich auf den Attributnamen und“WertIst der neue Wert zugeordnet.

Element.removeTtribute (Name)

Hier, "Name”Bezieht sich auf den Namen des jeweiligen Attributs.

Gehen Sie das folgende Beispiel zur Demonstration durch.

Beispiel

Zunächst zwei Tasten mit “beigeben“Attribute hinzufügen" Und "removeattributeIDS. Diese Schaltflächen werden zum Hinzufügen und Entfernen des Readonly -Attributs verwendet. Fügen Sie auch eine Eingabe -ID als "einText”Zum Eingeben der Textdaten:

Attribute hinzufügen
Attribut entfernen

Verwenden Sie in der JavaScript -Datei die “dokumentieren.QuerySelector ()”Mit Hilfe ihrer angegebenen IDs die hinzugefügten HTML -Elemente abrufen:

var addbutton = dokument.querySelector ('#addattribute');
var removeButton = Dokument.QuerySelector ('#removeTtribute');
var get = document.QuerySelector ('Eingabe');

Danach anwenden Sie die “AddEventListener ()Methode zum Anhängen des Klick -Ereignishandlers mit der Methode SetAtTribute (). Es wird so funktionieren, dass wenn die “Attribute hinzufügenKlicken Sie auf die Schaltfläche "Der Wert des Eingangsfeldes wird als" festgelegt "festgelegt"schreibgeschützt”:

Addbutton.AddEventListener ('Click', () =>
erhalten.setAttribute ('readonly', wahr);
);

Wiederholen Sie dieselbe Prozedur zum Entfernen des SET -Attributs, indem Sie das Ereignis separat einfügen und die Methode removeTtribute () anwenden:

REMEBUTTON.AddEventListener ('Click', () =>
erhalten.removeTtribute ('readonly');
);

Zum Testzweck geben wir zunächst einen Wert in das Eingabefeld ein und klicken auf die Schaltfläche "Attribut hinzufügen". Infolgedessen wird das Attribut des Mehrwerts als readonly festgelegt. Klicken Sie dann auf die Schaltfläche Attribut entfernen. Sie können feststellen, dass der Wert weiterhin da ist (nicht entfernt). So funktioniert das gegebene Programm:

Wir haben die einfachsten Methoden zum Hinzufügen und Entfernen von Readonly -Attributen in JavaScript bereitgestellt.

Abschluss

Hinzufügen und Entfernen von Readonly -Attributen in JavaScript, die “setAttribute ()" Und "removeTtribute ()„Methoden können zum Hinzufügen und Entfernen des Readonly -Attributs verwendet werden, indem die entsprechende Taste -ID abgerufen wird, einschließlich eines Ereignishandlers und eines Eingabetyps mit jedem der implementierten Methoden. In diesem Blog wurden die Methoden zum Hinzufügen und Entfernen von Readonly -Attributen in JavaScript erläutert.