HTML - Commentaires

Le commentaire est un morceau de code ignoré par tout navigateur Web. Il est recommandé d'ajouter des commentaires dans votre code HTML, en particulier dans les documents complexes, pour indiquer des sections d'un document et toute autre note à quiconque consulte le code. Les commentaires vous aident ainsi que les autres à comprendre votre code et améliorent la lisibilité du code.

Les commentaires HTML sont placés entre <!-- ... -->Mots clés. Ainsi, tout contenu placé avec des balises <! - ... -> sera traité comme un commentaire et sera complètement ignoré par le navigateur.

Exemple

<!DOCTYPE html>
<html>

   <head>  <!-- Document Header Starts -->
      <title>This is document title</title>
   </head> <!-- Document Header Ends -->
	
   <body>
      <p>Document content goes here.....</p>
   </body>
	
</html>

Cela produira le résultat suivant sans afficher le contenu donné dans le cadre des commentaires -

Commentaires valides ou non valides

Les commentaires ne s'emboîtent pas, ce qui signifie qu'un commentaire ne peut pas être placé dans un autre commentaire. Deuxièmement, la séquence à deux tirets "-" peut ne pas apparaître dans un commentaire sauf dans le cadre de la balise de fermeture ->. Vous devez également vous assurer qu'il n'y a pas d'espaces dans la chaîne de début de commentaire.

Exemple

Ici, le commentaire donné est un commentaire valide et sera effacé par le navigateur.

<!DOCTYPE html>
<html>

   <head>
      <title>Valid Comment Example</title>
   </head>
	
   <body>
      <!--   This is valid comment -->
      <p>Document content goes here.....</p>
   </body>
	
</html>

Cela produira le résultat suivant -

Mais, la ligne suivante n'est pas un commentaire valide et sera affichée par le navigateur. En effet, il y a un espace entre le crochet angulaire gauche et le point d'exclamation.

<!DOCTYPE html>
<html>

   <head>  
      <title>Invalid Comment Example</title>
   </head>
	
   <body>
      < !--   This is not a valid comment -->
      <p>Document content goes here.....</p>
   </body>
	
</html>

Cela produira le résultat suivant -

Commentaires multilignes

Jusqu'à présent, nous avons vu des commentaires sur une seule ligne, mais HTML prend également en charge les commentaires sur plusieurs lignes.

Vous pouvez commenter plusieurs lignes avec la balise spéciale de début <! - et la balise de fin -> placée avant la première ligne et la fin de la dernière ligne, comme indiqué dans l'exemple ci-dessous.

Exemple

<!DOCTYPE html>
<html>

   <head>  
      <title>Multiline Comments</title>
   </head> 
	
   <body>
      <!-- 
         This is a multiline comment and it can
         span through as many as lines you like.
      -->
      
      <p>Document content goes here.....</p>
   </body>
	
</html>

Cela produira le résultat suivant -

Commentaires conditionnels

Les commentaires conditionnels ne fonctionnent que dans Internet Explorer (IE) sous Windows, mais ils sont ignorés par les autres navigateurs. Ils sont pris en charge à partir d'Explorer 5 et vous pouvez les utiliser pour donner des instructions conditionnelles à différentes versions d'IE.

Exemple

<!DOCTYPE html>
<html>

   <head>  
      <title>Conditional Comments</title>

      <!--[if IE 6]>
         Special instructions for IE 6 here
      <![endif]-->
   </head> 
   
   <body>
      <p>Document content goes here.....</p>
   </body>
	
</html>

Vous rencontrerez une situation où vous devrez appliquer une feuille de style différente basée sur différentes versions d'Internet Explorer, dans une telle situation, des commentaires conditionnels seront utiles.

Utilisation de la balise de commentaire

Il existe peu de navigateurs qui prennent en charge la balise <comment> pour commenter une partie du code HTML.

Note- La balise <comment> est obsolète en HTML5. N'utilisez pas cet élément.

Exemple

<!DOCTYPE html>
<html>

   <head>
      <title>Using Comment Tag</title>
   </head>
	
   <body>
      <p>This is <comment>not</comment> Internet Explorer.</p>
   </body>
	
</html>

Si vous utilisez IE, cela produira le résultat suivant -

Mais si vous n'utilisez pas IE, cela produira le résultat suivant -

Commentaire du code de script

Bien que vous apprendrez JavaScript avec HTML, dans un didacticiel séparé, mais ici, vous devez noter que si vous utilisez Java Script ou VB Script dans votre code HTML, il est recommandé de mettre ce code de script dans des commentaires HTML appropriés afin que l'ancien les navigateurs peuvent fonctionner correctement.

Exemple

<!DOCTYPE html>
<html>

   <head>
      <title>Commenting Script Code</title>
      
      <script>
         <!-- 
            document.write("Hello World!")
         //-->
      </script>
   </head>
	
   <body>
      <p>Hello , World!</p>
   </body>
	
</html>

Cela produira le résultat suivant -

Commenter les feuilles de style

Bien que vous apprendrez à utiliser des feuilles de style avec HTML dans un didacticiel séparé, mais ici, vous devez noter que si vous utilisez une feuille de style en cascade (CSS) dans votre code HTML, il est recommandé de placer ce code de feuille de style dans les commentaires HTML appropriés afin que les anciens navigateurs puissent fonctionner correctement.

Exemple

<!DOCTYPE html>
<html>

   <head>
      <title>Commenting Style Sheets</title>
      
      <style>
         <!--
            .example {
               border:1px solid #4a7d49;
            }
         //-->
      </style>
   </head>
	
   <body>
      <div class = "example">Hello , World!</div>
   </body>
	
</html>

Cela produira le résultat suivant -