Proprietà dataset

Nel linguaggio HTML è permesso aggiungere i propri attributi ai tag, a condizione che inizino con data-, seguito da qualsiasi nome per l'attributo. Per accedere a tali attributi tramite JavaScript si utilizza una proprietà speciale dataset.

Sintassi

javascriptelemento.dataset.nome;

Esempio

Leggiamo il valore dell'attributo:

html<div data-cost="1000"></div>

javascriptlet elem = document.querySelector('div');
let res = elem.dataset.cost;

console.log(res);

Risultato dell'esecuzione del codice:

javascript'1000'

Esempio

Modifichiamo il valore dell'attributo:

html<div data-cost="1000"></div>

javascriptlet elem = document.querySelector('div');
elem.dataset.cost = '2000';

Di conseguenza, il codice risulterà così:

html<div data-cost="2000"></div>

Vedi anche