カスタムデータ属性

カスタムデータ属性とは、data属性を任意に付与することができる属性のこと

HTMLコード

 <button>和英</button>

 <h1 id="target" data-hoge="Thank you">ありがとう</h1>

JSコード

  document.querySelector("button").addEventListener("click", () =>{
   const targetNode = document.getElementById("target");

   targetNode.textContent = targetNode.dataset.hoge;
 });

＊data-hoge　⇒　dataset.hoge　へ変更する

ボタンを押すと英語表記へ変わる