DOM
Manipolazione degli attributi
Ricerca…
Osservazioni
Gli attributi sono un tipo specifico di oggetto nell'API DOM. Nelle versioni precedenti dell'API DOM, venivano ereditati dal tipo Node , ma questo era cambiato nella versione 4.
Negli esempi che fanno riferimento al dataset di dataset , "browser moderni" esclude specificamente versioni di Internet Explorer inferiori a 11. Vedere caniuse.com per informazioni più aggiornate.
Ottenere un attributo
Alcuni attributi sono direttamente accessibili come proprietà dell'elemento (ad es. alt , href , id , title e value ).
var a = document.querySelector("a"),
url = a.href;
Altri attributi, inclusi gli attributi dei dati, sono accessibili come segue:
var a = document.querySelector("a"),
tooltip = a.getAttribute("aria-label");
È anche possibile accedere agli attributi dei dati utilizzando il dataset (browser moderni)
// <a href="#" data-tracking-number="ABC-123">Widget</a>
var a = document.querySelector("a"),
tracker = a.dataset.trackingNumber;
Impostazione di un attributo
Alcuni attributi sono direttamente accessibili come proprietà dell'elemento (ad es. Alt, href, id, titolo e valore).
document.querySelector("a").href = "#top";
Altri attributi, inclusi gli attributi dei dati, possono essere impostati come segue:
document.querySelector("a").setAttribute("aria-label", "I like turtles");
Gli attributi dei dati possono anche essere impostati utilizzando il set di dati (browser moderni)
var a = document.querySelector("a");
a.dataset.test = "123";
a.dataset['test-2'] = "456";
risultati in
<a href="#" data-test="123" data-test-2="456">Widget</a>
Rimozione di un attributo
Per rimuovere un attributo, incluse le proprietà direttamente accessibili
document.querySelector("a").removeAttribute("title");
Gli attributi dei dati possono anche essere rimossi come segue (browser moderni):
// remove "data-foo" attribute
delete document.querySelector("a").dataset.foo;