data属性の取得・設定・更新【JavaScript】
| WEB制作data属性(data-*)の取得・設定・更新です。
data属性の取得方法
<div class="datasetnnoyatsu" data-num='1'></div>
// Javascript
const num = document.querySelector('.datasetnnoyatsu').dataset.num
console.log(num)
// jQuery
console.log($('.datasetnnoyatsu').data('num'));
data属性の設定・更新方法
<div class="datasetnnoyatsu" data-num='1'></div>
// Javascript
document.querySelector('.datasetnnoyatsu').dataset.num = 12345
// jQuery
$('.datasetnnoyatsu').data('num') = 12345
どちらも簡単ですね。
data属性はjsを触る際には結構便利ですから、覚えておくといいと思います。
微妙に忘れて困るのでメモ書き