次のコードで、カスタム属性 data-id=”123″ の値を取得する正しい方法はどれか。
[ html ]
<div id="box" data-id="123"></div>
- document.getElementById(“box”).getAttribute(“data-id”)
- document.getElementById(“box”).dataset.id
- 両方とも可能
- どちらも不可
正解
- 両方とも可能
解説
カスタムデータ属性は getAttribute(“data-属性名”) または dataset.属性名 の両方で取得可能。
使用例(サンプルコード)
[ javascript ]
let box = document.getElementById("box");
console.log(box.getAttribute("data-id")); // "123"
console.log(box.dataset.id); // "123"