Element.setAttribute()
Imposta il valore di un attributo sull'elemento specificato. Se l'attributo esiste già, il valore viene aggiornato; in caso contrario viene aggiunto un nuovo attributo con il nome e il valore specificati.
Per ottenere il valore corrente di un attributo, utilizza il metodo getAttribute()
; per rimuovere un attributo, usa removeAttribute()
.
Sintassi
Element.setAttribute(nome, valore);
Parametri
nome
- Una
DOMString
specifica il nome dell'attributo il cui valore deve essere impostato. Il nome dell'attributo viene automaticamente convertito in minuscolo quandosetAttribute()
viene chiamato su un elemento in un documento HTML. valore
- Una
DOMString
contenente il valore da assegnare all'attributo. Qualsiasi valore non stringa specificato viene convertito automaticamente in una stringa.
Gli attributi booleani sono considerati true
se sono presenti sull'elemento, indipendentemente dal loro valore
effettivo; di norma, è necessario specificare la stringa vuota (""
) in valore
(alcune persone usano il nome dell'attributo, ma funziona in modo non standard). Vedi l'esempio sotto per una dimostrazione pratica.
Poiché il valore
specificato viene convertito in una stringa, specificare null
non fa necessariamente ciò che si aspetta. Invece di rimuovere l'attributo o impostarne il valore come null
, imposta invece il valore dell'attributo sulla stringa null
. Se vuoi rimuovere un attributo, usa removeAttribute()
.
Valore di ritorno
Eccezioni
InvalidCharacterError
- L'attributo specificato
nome
contiene uno o più caratteri che non sono validi nei nomi degli attributi.
Esempio
Nell'esempio seguente, setAttribute()
viene utilizzato per impostare gli attributi su un <button> (en-US).
HTML
<button>Hello World</button>
JavaScript
var b = document.querySelector("button");
b.setAttribute("name", "helloButton");
b.setAttribute("disabled", "");
Questo dimostra due cose:
- La prima chiamata a
setAttribute()
mostra la modifica del valore dell'attributoname
su "helloButton". Puoi vederlo usando l'ispettore di pagina del tuo browser (Chrome, Edge, Firefox, Safari). - Per impostare il valore di un attributo booleano, come
disabled
, puoi specificare qualsiasi valore. Una stringa vuota o il nome dell'attributo sono valori consigliati. Tutto ciò che conta è che se l'attributo è presente a tutti, indipendentemente dal suo valore reale, il suo valore è consideratotrue
. L'assenza dell'attributo significa che il suo valore èfalse
. Impostando il valore dell'attributodisabled
sulla stringa vuota (""
), stiamo impostandodisabled
sutrue
, il risultato è che il pulsante è disabilitato.
DOM methods dealing with element's attributes:
Not namespace-aware, most commonly used methods | Namespace-aware variants (DOM Level 2) | DOM Level 1 methods for dealing with Attr nodes directly (seldom used) |
DOM Level 2 namespace-aware methods for dealing with Attr nodes directly (seldom used) |
---|---|---|---|
setAttribute (DOM 1) |
setAttributeNS (en-US) |
setAttributeNode (en-US) |
setAttributeNodeNS (en-US) |
getAttribute (DOM 1) |
getAttributeNS (en-US) |
getAttributeNode (en-US) |
getAttributeNodeNS (en-US) |
hasAttribute (DOM 2) |
hasAttributeNS (en-US) |
- | - |
removeAttribute (DOM 1) |
removeAttributeNS (en-US) |
removeAttributeNode (en-US) |
- |
Specifiche
Compatibilità con i browser
BCD tables only load in the browser
Gecko notes
L'utilizzo di setAttribute()
per modificare determinati attributi, in particolare value
in XUL, funziona in modo incoerente, in quanto l'attributo specifica il valore predefinito. Per accedere o modificare i valori correnti, è necessario utilizzare le proprietà. Ad esempio, utilizzare Element.value
anziché Element.setAttribute()
.