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

21 votes203 views5 answers
Latex link
Html
0 vote175 views2 answers
Jquery html input value add
Html
1 vote179 views2 answers
Put space between text html
Html
0 vote191 views1 answer
Select html gray safari
Html
0 vote161 views10 answers
How to create a snake game in html css js
Html
0 vote190 views1 answer
How to align select in table cell center html
Html
0 vote200 views1 answer
Was not loaded because its mime type, “text/html”, is not “text/css”. react
Html
20 votes192 views4 answers
Bootstrap col center content
Html
3 votes188 views2 answers
Include a small box in html
Html
0 vote190 views3 answers
Sub html
Html