Attribut id HTML

Définition et utilisation

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

id L'attribut est le plus souvent utilisé pour pointer vers des styles dans une feuille de style, et pour manipuler des éléments spécifiques par leur id via JavaScript (par l'intermédiaire de l'HTML DOM).

id L'attribut peut également être utilisé comme ancre de lien (link anchor).

Voir également :

Tutoriel HTML :HTML id

Tutoriel HTML :Attributs HTML

Tutoriel CSS :Syntaxe CSS

Manuel CSS :CSS #id Sélecteur

Manuel HTML DOM :Méthode getElementById() HTML DOM

Manuel HTML DOM :Attribut id HTML DOM

Manuel HTML DOM :Objet Style DOM HTML

Exemple

Exemple 1

Utilisez l'attribut id pour changer un texte via JavaScript :

<html>
<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="displayResult()">Changer le texte</button>
<script>
function displayResult() {
  document.getElementById("myHeader").innerHTML = "Have a nice day!";
}
</script>
</body>
</html>

Essayez-le vous-même

Plus d'exemples sont fournis en bas de la page.

Syntaxe

<element id="id">

Valeur de l'attribut

Valeur Description
id

Spécifiez un id unique pour l'élément. Règles de nommage :

  • Doit contenir au moins un caractère
  • Ne peut pas contenir d'espaces

Plus d'exemples

Exemple 2

Utilisez l'attribut id pour lier à un élément d'une page ayant un id spécifique :

<html>
<body>
<h2><a id="top">Un titre</a></h2>
<p>Beaucoup de texte ....</p>
<p>Beaucoup de texte ....</p>
<p>Beaucoup de texte ....</p>
<a href="#top">Retour en haut de page</a>
</body>
</html>

Essayez-le vous-même

Exemple 3

Utilisez l'attribut id pour styliser du texte avec CSS :

<html>
<head>
<style>
#myHeader {
  color: red;
  text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">CodeW3C.com est le meilleur !</h1>
</body>
</html>

Essayez-le vous-même

Compatibilité du navigateur

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support