HTML attribut id

Définition et utilisation L’attribut id

HTML Les attributs globaux

L'attribut id spécifie un identifiant unique pour un élément HTML (la valeur doit être unique dans le document HTML).

L'attribut id est plus utilisé pour pointer vers un style dans une feuille de style (voir notre tutorial sur l’utilisation de class en html)., et par JavaScript (via le DOM HTML) pour manipuler l'élément avec l'id spécifique (voir notre tutorial javascript).

Syntaxe

Exemple Utilisez l'attribut id pour manipuler le texte avec JavaScript:

Sélectionner le code


  <!DOCTYPE html>
  <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html;
  charset=utf-8" />
  <title>html5 demo</title>
  <script type="text/javascript">
  function afficher()
  {
  document.getElementById("monTitre").innerHTML="Quel beau jour!";
  }
  </script>
  </head>
  <body>
  <h1 id="monTitre">Bonjour le monde!</h1>
  <button onclick="afficher()">Changer texte</button>
  </body>
  </html>

(autre exemple au bas de cette page)

Navigateurs pris en charge

Internet Explorer Firefox Opéra Google Chrome Safari

L'attribut id est pris en charge dans tous les principaux navigateurs.

Différences entre HTML 4.01 et HTML5

En HTML5, l'attribut id peut être utilisée sur n'importe quel élément HTML .

En HTML 4.01, l'attribut id ne peut pas être utilisé avec: <base>, <head>, <html>, <meta>, <param>, <script>, <style> et <title>.

Remarque: HTML 4.01 a de plus grandes restrictions sur le contenu des valeurs id (par exemple, des valeurs id HTML 4.01 ne peut pas commencer par un chiffre).

Valeurs de l’attributs id

Valeur	Description
Identifiant	Spécifie un identifiant unique pour l'élément. Règles de nomination : Doit contenir au moins un caractère Ne doit contenir aucun espace En HTML, toutes les valeurs sont insensibles à la casse

Exemple Ajouter un attribut id à un élément HTML, et l'utiliser en CSS

Utilisez l'attribut id pour le style du texte avec CSS.

Sélectionner le code


  <!DOCTYPE html>
  <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html;
  charset=utf-8" />
  <title>html5 demo</title>
  <style>
  #monTitre
  {
  color:red;
  text-align:center;
  }
  </style>
  </head>
  <body>
  <h1 id="monTitre">Le site Apprendre créer sites est le
  meilleur !</h1>
  </body>
  </html>

Retour à la liste des attributs globaux

accueil HTML 5

Par gerywa 20 mars 2014

HTML L’attribut id

HTML les attributs globaux