Using the dataset property in JavaScript

In plain old JavaScript you can get the data attributes of

[code language="html"]

lorum ipsum
```

like this

[code language="javascript"] document.getElementById('test').getAttribute('data-news-item-id');



But did you know there's a alternative way of doing this by reading an element's dataset property?

[code language="javascript"]
document.getElementById('test').dataset.newsItemId;

Notice that the values can be accessed by camelcasing the name of the data attribute. You can also write to datasets to change values of data attributes. Read the informative helpful article on MDN to know more.

Join 9,500+ smart developers

Get my monthly newsletter with what I learn from running Spatie, building Oh Dear, and maintaining 300+ open source packages. Practical takes on Laravel, PHP, and AI that you can actually use.

No spam. Unsubscribe anytime. You can also follow me on X.

Found something interesting to share? Submit a link to the community section.