How to remove data-* attributes using HTML5 dataset
Wouldn't 'delete' remove dataset element? E.g.:
<div id="a1" data-foo="bar">test</div><script>var v = document.getElementById('a1'); alert(v.dataset.foo);delete v.dataset.foo;alert(v.dataset.foo);</script>
A rather simpler and straightforward approach:
const someElement = document.querySelector('...');Object.keys(someElement.dataset).forEach(dataKey => { delete someElement.dataset[dataKey];});
This is to remove all the data-* attributes. You can add a condition in the for loop to remove only particular data-attribute. Hope this helps :)
var elem = document.querySelector('#example');var dataset = elem.dataset;for (var key in dataset) { elem.removeAttribute("data-" + key.split(/(?=[A-Z])/).join("-").toLowerCase());}