Η ιδιότητα dataset

Στη γλώσσα HTML επιτρέπεται να προσθέτετε τα δικά σας χαρακτηριστικά στις ετικέτες, με την προϋπόθεση ότι πρέπει να ξεκινούν με data-, και στη συνέχεια μπορεί να ακολουθεί οποιοδήποτε όνομα χαρακτηριστικού. Για την πρόσβαση σε τέτοια χαρακτηριστικά μέσω JavaScript χρησιμοποιείται μια ειδική ιδιότητα dataset.

Σύνταξη

javascriptστοιχείο.dataset.όνομα;

Παράδειγμα

Ας διαβάσουμε την τιμή του χαρακτηριστικού:

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

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

console.log(res);

Αποτέλεσμα εκτέλεσης κώδικα:

javascript'1000'

Παράδειγμα

Ας αλλάξουμε την τιμή του χαρακτηριστικού:

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

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

Ως αποτέλεσμα, ο κώδικας θα γίνει ως εξής:

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

Δείτε επίσης