Custom data attributes html

Js get data attribute

var element = document.querySelector('.element');
var dataAttribute = element.getAttribute('data-name');
// replace "data-name" with your data attribute name

console.log(dataAttribute);

Javascript get data attribute value

const article = document.querySelector('#electric-cars');
 
article.dataset.columns // "3"
article.dataset.indexNumber // "12314"
article.dataset.parent // "cars"

Source: developer.mozilla.org

Custom data attributes html

<div data-myvar="hello world"</div>
<script>
 //Note: attribute in html will force lowercase, make sure all letters are lower
  var element = document.querySelector("div");
  console.log(element.dataset.myvar);
  //outputs: hello world
</script>

Similar codes

1 vote142 views1 answer
Empty link javascript
Html
2 votes156 views1 answer
Html input file multiple
Html
3 votes150 views1 answer
Form tag radio
Html
0 vote148 views1 answer
How zcdfdgfvcstop marquee text when you move your mouse over it
Html
0 vote187 views1 answer
Html gif not showing
Html
12 votes152 views3 answers
Html datalist
Html
0 vote155 views1 answer
How to send boolean with newselectList from cshtml in form C#
Html
0 vote156 views1 answer
Create ion card
Html
0 vote142 views1 answer
Phpstrom goto bookmark
Html
44 votes141 views3 answers
Link to another page in html
Html