HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

スクリプトタグ内のHTMLコメントはベストプラクティスか?現代のJavaScriptでの正しい理解

JavaScriptは、<script>...</script>タグの間にコードを記述することで、HTML文書内に直接実装できます。

<script ...>
  JavaScriptコード
</script>

HTMLコメントを含めた記述例

以下のように、<script>タグの中にHTMLコメントを追加することができます(任意の記述です)。

<html>
  <body>
    <script>
      <!--
        document.write("Hello World!")
      //-->
    </script>
  </body>
</html>

この例では、JavaScriptコード全体をHTMLコメントで囲んでいます。かつてこれがベストプラクティスとされていたのは、JavaScriptに対応していない古いブラウザが、スクリプトのコードをそのままページ上にテキストとして表示してしまうのを防ぐためです。コメントで囲んでおけば、非対応ブラウザはコードを無視してくれます。

また、コメントの終わりが「//-->」になっている点にも注目しましょう。「//」はJavaScriptにおける一行コメントを意味する記号です。これにより、ブラウザがHTMLコメントの終了記号「-->」をJavaScriptのコードとして誤って解釈・実行しようとするのを防いでいます。

現代では不要となった手法

ただし、現在においてこの書き方は推奨されていません。今日のすべての主要ブラウザがJavaScriptを標準サポートしているため、HTMLコメントでコードを隠す必要はもうありません。むしろ、XHTML環境ではコメント扱いされてスクリプトが動作しなくなるなど、意図しない問題を引き起こす可能性があります。

そのため、新しいプロジェクトでは<script>タグ内に直接JavaScriptを記述するか、src属性で外部JSファイルを読み込む形式が標準的なベストプラクティスとなっています。歴史的な経緯として「かつては有効だった」という点を理解しておくと良いでしょう。

  1. HTMLのscript要素におけるcharset属性の使い方を解説

    script要素のcharset属性とは <script>要素のcharset属性は、外部スクリプトファイルで使用する文字エンコーディング(文字セット)を指定するための属性です。外部ファイル内に日本語などのマルチバイト文字が含まれる場合に、文字化けを防いで正しく表示するために利用されてきました。 なお、charset属性はHTML5では廃止された属性であり、現在ではサーバー側のHTTPヘッダーや<meta>タグによって文字コードを指定するのが一般的です。歴史的な仕様やレガシーコードの理解として押さえておきましょう。 構文 <script charset="

  2. HTMLコメントの書き方を解説!単一行コメントと複数行コメントの基本

    HTMLコメントは、<!-- ... -->タグの間に記述します。このタグ内に書かれた内容はすべてコメントとして扱われ、ブラウザには完全に無視されるため、画面上には表示されません。 HTMLにおける単一行コメント HTMLでは、コードの説明やメモを残したいときにコメント機能を活用できます。まずは、単一行コメントの基本的な例を見てみましょう。 サンプルコード <!DOCTYPE html> <html> <head> <!-- ドキュメントヘッダーの開始 --> <title>これはドキュメントのタイトルです</tit