HTML  コメントタグの役割の詳細な分析

多くのウェブサイトのソースコードを確認すると、多くのコメントが見つかります。特に、ソース文書にコメントを挿入するために使用されるSina.comコメントタグはそうです。コメントテキストは一般的にプログラマーの参考資料として使用され、特に複数人で開発された大規模なウェブサイトのソースコードではそうです。コメントがない場合、プログラマーAが書いたコードはプログラマーBには認識されません。このように、プログラマーAが辞めた場合、彼が書いたコードを維持することは困難になります。コメントがあれば、コードを理解しやすくなります。

Sina.com ソースコード HTML コメント (緑色のテキストはコメントです)

HTML コメントはブラウザによって無視され、Web サイトのソースコード内に直接記述された HTML コメントはフロントエンドには表示されません。上の図に示すように、緑色の部分はコメントであり、表示されません。上記の緑色のテキストを通じて、このコードの意味とコードの開始位置と終了位置を知ることができます。 HTML コメントの形式は次のとおりです。

コードをコピー

コードは次のとおりです。

HTMLコメントの高度な機能

名前が示すように、HTML コメントはプログラムの内部構造を説明するコメントの一種です。実際、これは最も基本的な機能にすぎませんが、フロントエンドブラウザーによって無視されるこれらの機能があるからこそ、現代の Web プログラムでは注釈についてさらに深く検討が行われ、注釈がますます便利になっています。

ページ内の CSS/JS への影響

HTML コメントは、ページ内の Javascript や CSS コードにも使用されます。多くの古いブラウザや Javascript や CSS を認識できないブラウザでは、コードが直接記述されている場合、テキストが表示されることが多く、読みやすさに大きな影響を与えます。

コードをコピー

コードは次のとおりです。

<!DOCTYPE html>
<html>
<ヘッド>
<スタイル>
ボディ{色:#F00}
</スタイル>
<script type="text/javascript">
alert('www.jb51.netへようこそ');
</スクリプト>
</head>
<本文>
<p>Jbzj!</p>
</本文>
</html>

上記のコードでは HTML コメントは使用されていません。一部の古いモバイルブラウザーや IE6 より前のバージョンでアクセスすると、次のテキストが表示されます。

コードをコピー

コードは次のとおりです。

body{color:#F00} alert('www.jb51.net へようこそ');</p> <p>Jbzj!

これらの古いブラウザが <style> や <script> などのタグを認識しない場合でも、これらのタグはタグ非表示の原則に従って表示されず、認識できないカスタムタグとして扱われます。これらのタグ内のテキストはそのまま表示されます。これらの CSS および Javascript コードは表示されたくないことは間違いないので、次のコメント付きコードを使用すると CSS および Javascript は表示されなくなります。

コードをコピー

コードは次のとおりです。

<!DOCTYPE html>
<html>
<ヘッド>
<スタイル>
<!--
ボディ{色:#F00}
--!>
</スタイル>
<script type="text/javascript">
<!--
alert('www.jb51.netへようこそ');
--!>
</スクリプト>
</head>
<本文>
<p>Jbzj!</p>
</本文>
</html>

HTMLコメントはMVC設計で使用される

多くの最新のオープンソースコードプロジェクト、特に MVC Web デザインスタイルのプロジェクトでは、従来の HTML コードにコメントを挿入し、そのコメントに広告などのコンテンツを追加します。

DiscuzはHTMLコメントを使用してコードを挿入し、Discuzコードを判断します