JavaScriptとHTMLファイル¶
HTMLの規格について¶
W3CからWHATWGへの移行¶
もともとは、標準化団体のW3C（1996年設立）がHTMLの仕様を策定していましたが、W3Cの活動とは別にApple, Opera, MozillaによるWHATWG（2004年設立）が独自にHTMLの仕様を作成するようになり、2021年にはW3CがHTML標準化活動を断念し、以降WHATWGでHTMLの標準化が一本化されました。
| HTML Living Standard | https://html.spec.whatwg.org/ |
| HTML Living Standard(日本語訳) | https://momdo.github.io/html/ |
HTMLファイルからJavaScriptのコードを実行¶
Webブラウザ上でJavaScriptを実行する場合の記述方法のメモです。
- HTMLファイル中に、JavaScriptコードを記述する
- HTMLファイルから、JavaScriptコードを記述したファイルを参照する
HTMLファイル中にJavaScriptコードを記述する¶
<script>
// JavaScriptコードを記述
</script>
サンプル1 div要素にJavaScriptからテキストを設定¶
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello JavaScript in HTML</title>
</head>
<body>
<div id="output"></div>
<script>
var outputText = document.getElementById('output');
outputText.textContent = "こんにちは、JavaScriptからテキストを設定しました。";
</script>
</body>
</html>
- HTMLのdiv要素にidを定義、JavaScriptから、このidを指定して要素を取得、その要素のテキスト記述を設定
HTMLファイルから、JavaScriptコードを記述したファイルを参照する¶
HTMLの <script>タグを用いてJavaScriptコード記述ファイルを参照します。
<script src="App/hello.js"></script>
<script>タグの記述位置¶
<script>タグは、<head>要素にも<body>要素にも記述できます。
<head>内に記述¶
- 画面表示よりも前に実行したい処理
<body>内に記述¶
- HTMLの要素（タグ）に対する操作をする処理