【JavaScript】HTML要素のタグを変更

2023年3月9日 20:42

HTML要素のタグを変更

divタグ内のh1タグをh3タグに書き換える方法です。

サンプルプログラム

<html>
<head>
	<meta charset="utf-8">
</head>
<body>
    <div id="mydiv">
      <h1>変更前</h1>
    </div>
    <input type="button" value="Click" onclick="myfunc()">
    <script>
      var myfunc = function(){
      
          var myh1 = document.getElementById("myh1");
          mydiv.innerHTML = "<h1>タグが変わりました！</h1>";
          
      }
    </script>
  </script>
</body>
</html>

実行結果

タグが変わりました！

このようにidを指定してみると任意のHTML要素にpタグなどの子要素を追加することもできるので便利です。

プログラムダウンロード

もっとJavaScriptを学びたい人は！こちらの本がおすすめです

#JavaScript #JavaScript初心者 #JavaScript学習 #プログラミング #プログラミング学習 #プログラミング初心者

この記事が気に入ったらサポートをしてみませんか？