dom_dom0300_009

data-*カスタムデータを読むとき、属性文字列として取得するには ( A )、キャメルケースのプロパティとして読むには ( B ) を使う。

解答

A: getAttribute
B: dataset

解説

getAttribute(‘data-user-id’)は文字列として返す。element.dataset.userIdはdata-user-idをキャメルケースにマッピングしてアクセスできる。

使用例（サンプルコード）

[ html ]

<div id="u" data-user-id="42"></div>
<script>
  const el = document.getElementById('u');
  console.log(el.getAttribute('data-user-id')); // (A) "42"
  console.log(el.dataset.userId);               // (B) "42"
</script>