JavaScript 複数のdata属性の値を取得する方法
環境
Google Chrome 109.0.5414.120
Windows 10 Home 64bit
構文
document.querySelector('セレクター’).dataset;
複数のdata属性の値を取得する場合は一度、datasetプロパティを変数に格納してから取り出します。
datasetはオブジェクトデータとして取得しますので、取得したいdata属性の
任意の名前部分を「.」で繋げて取得します。
使用例
<!DOCTYPE html> <html> <body> <div id="item" data-num="668" data-name="cft"></div> <button>テスト</button> <script> function funA() { let obj = document.querySelector('#item').dataset; alert(obj.name); alert(obj.num); } </script> </body> </html>
実行結果
「テスト」ボタンを押すと、「cft」と「668」が表示されます。