[javascript]data属性を設定、更新するサンプル

2014年4月4日2021年8月16日

書式
data-name=xxxx
使用例
1.data属性（data-*）を設定

htmlコード
<div id="user"></div>

JSコード
let user = document.getElementById('user');
user.dataset.name = 'cft';

2.data属性（data-*）を更新

htmlコード
<div id="user" data-name="cft"></div>

JSコード
let user = document.getElementById('user');
user.dataset.name = 'cftt';

3.data属性（data-*）を取得

htmlコード
<div id="user" data-name="cft"></div>

JSコード
let user = document.getElementById('user');
console.log(user.dataset.name)