How can I access data attributes in JavaScript?

How can I access data attributes in JavaScript?

You can access data attributes using the dataset property of an HTML element. For example, if you have an element like <div data-user-id='123'>, you can access it with element.dataset.userId.

Can you give me an example of how to set a data attribute?

Sure! You can set a data attribute using the setAttribute method. For instance, element.setAttribute('data-user-name', 'John'); will set the data-user-name attribute.

What if I want to retrieve all data attributes from an element?

You can loop through the dataset object. For example: for (let key in element.dataset) { console.log(key, element.dataset[key]); } will log all data attributes.

Are there any browser compatibility issues I should be aware of?

The dataset property is widely supported in modern browsers, but if you need to support very old browsers, you might want to use getAttribute and setAttribute as a fallback.