javascript dataset code example

Example 1: dataset js

for javascript : 
webappData.getAttribute('data-id');
document.querySelector('#elementId').dataset.id = 'value';

for jquery : 
$(element).attr('data-key', 'value');

Example 2: javascript get data attribute value

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

Example 3: accèder data-id javascript

<article
  id="voitureelectrique"
  data-columns="3"
  data-index-number="12314"
  data-parent="voitures">
...
</article>
var article = document.getElementById('voitureelectrique');
 
article.dataset.columns // "3"
article.dataset.indexNumber // "12314"
article.dataset.parent // "voitures"

Example 4: javascript dataset

//html file
<div id="user" data-user-id="2" data-user-date-of-birth="03/03/1993">
 <p> Hello ! </p>
</div>

//js file
const user = document.getElementById('user')

console.log(user.dataset.userId) // => 2

console.log(user.dataset.userDateOfBirth) // => '03/03/1993'