How to change HTML Attribude with JavaScript

Question

I have a div where is an HTML Attribute called data-theme inside. I want to ask how do I change the value of the Attribute called data-theme. For example: From: data-theme="dark" to data-theme="light". The value is stored in a variable as a string.

My div:

<div id="myId" data-theme="dark"></div>

I want to use normal JavaScript.

Does this answer your question? https://stackoverflow.com/questions/13524107/how-to-set-data-attributes-in-html-elements Please see second answer for native JS. — 0stone0, Feb 08 '22 at 18:30
@LucaKiebel you're right. Second question is a better match for this :-) — Michael Hirschler, Feb 09 '22 at 09:25

score 0 · Accepted Answer · answered Feb 08 '22 at 18:24

0

document.getElementById("myId").setAttribute("data-theme", "newValue")

answered Feb 08 '22 at 18:24

Ismail_Aj

332
1
4
17

1

Elements have a specialized `dataset` object which syncs with the corresponding data-attributes. `document.getElementById("myId").dataset.theme="light";`. – connexo Feb 08 '22 at 18:35

How to change HTML Attribude with JavaScript

1 Answers1