HTML DOM setAttribute() Methode
❮Het Element-ObjectVoorbeeld
Voeg het class attribuut met de waarde "democlass" toe aan een <h1> element:
document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");
Voordat u het kenmerk instelt:
Hello World
Na het instellen van het attribuut:
Hello World
Meer "Probeer het zelf" voorbeelden hieronder.
Definitie en gebruik
De methode setAttribute() voegt het opgegeven kenmerk toe aan een element en geeft het de opgegeven waarde.
Als het opgegeven kenmerk al bestaat, wordt alleen de waarde ingesteld/gewijzigd.
Opmerking: hoewel het met deze methode mogelijk is om het style-attribuut met een waarde aan een element toe te voegen, is het aan te raden om in plaats daarvan eigenschappen van het Style-object te gebruiken voor inline styling, omdat dit geen andere CSS-eigenschappen overschrijft die mogelijk zijn gespecificeerd in het stijlkenmerk:
Slechte:
element.setAttribute("style", "background-color: red;");
Goed:
element.style.backgroundColor = "red";
Tip: Gebruik de methode removeAttribute() om een attribuut uit een element te verwijderen.
Tip: Zie ook de methode setAttributeNode() .
Browserondersteuning
De getallen in de tabel geven de eerste browserversie aan die de methode volledig ondersteunt.
| Method | |||||
|---|---|---|---|---|---|
| setAttribute() | Yes | 8.0 | Yes | Yes | Yes |
Syntaxis
element.setAttribute(attributename, attributevalue)
Parameterwaarden
| Parameter | Type | Description |
|---|---|---|
| attributename | String | Required. The name of the attribute you want to add |
| attributevalue | String | Required. The value of the attribute you want to add |
Technische details
| Winstwaarde: | Geen retourwaarde |
|---|---|
| DOM-versie | Kernniveau 1 Element Object |
Meer voorbeelden
Voorbeeld
Een invoerveld wijzigen in een invoerknop:
document.getElementsByTagName("INPUT")[0].setAttribute("type", "button");
Voordat u het kenmerk instelt:
Na het instellen van het attribuut:
Voorbeeld
Voeg een href-kenmerk met de waarde "www.w3schools.com" toe aan een <a>-element:
document.getElementById("myAnchor").setAttribute("href", "https://www.w3schools.com");
Voordat u het kenmerk instelt:
Na het instellen van het attribuut:
Voorbeeld
Zoek uit of een <a>-element een doelkenmerk heeft. Als dit het geval is, wijzigt u de waarde van het doelkenmerk in "_self":
// Get the <a> element with id="myAnchor"
var x = document.getElementById("myAnchor");
// If the <a> element has a target attribute, set the value to "_self"
if (x.hasAttribute("target")) {
x.setAttribute("target", "_self");
}
Gerelateerde pagina's
HTML-zelfstudie: HTML-kenmerken
HTML DOM-referentie: methode getAttribute()
HTML DOM-referentie: hasAttribute()-methode
HTML DOM-referentie: methode removeAttribute()
❮Het Element-Object