JavaScriptでHTML内で変数の値を表示する方法

文字列結合を使用する方法: 変数の値を文字列として表示するために、文字列結合演算子（+）を使用します。次の例を参考にしてください。

<!DOCTYPE html>
<html>
<body>
  <script>
    var myVariable = "Hello, World!";
    document.write("変数の値は: " + myVariable);
  </script>
</body>
</html>

HTML要素のテキストコンテンツを変更する方法: HTML要素のテキストコンテンツを変更して変数の値を表示する方法もあります。以下の例を参考にしてください。

<!DOCTYPE html>
<html>
<body>
  <p id="myParagraph"></p>
  <script>
    var myVariable = "Hello, World!";
    document.getElementById("myParagraph").innerText = "変数の値は: " + myVariable;
  </script>
</body>
</html>

コンソールに出力する方法: 変数の値をコンソールに出力することもできます。以下の例を参考にしてください。

<!DOCTYPE html>
<html>
<body>
  <script>
    var myVariable = "Hello, World!";
    console.log("変数の値は: " + myVariable);
  </script>
</body>
</html>

これらの方法を使用すると、JavaScriptで定義された変数の値をHTML内で表示できます。必要に応じて、他の方法やより複雑なテンプレートエンジンを使用することもできますが、基本的な表示には上記の方法が役立ちます。