Proprietà id HTML

Definizione e uso

id L'attributo specifica l'id unico di un elemento HTML (questo valore deve essere unico nell'HTML documento).

id L'attributo viene utilizzato principalmente per puntare a uno stile in una tabella di stili e per manipolare elementi con un id specifico utilizzando JavaScript (attraverso HTML DOM).

id L'attributo può anche essere utilizzato come collegamento ancore (link anchor).

Vedi anche:

Corso HTML:HTML id

Corso HTML:Proprietà HTML

Corso CSS:Sintassi CSS

Manuale CSS:CSS #id Selettore

Manuale HTML DOM:Metodo getElementById() HTML DOM

Manuale HTML DOM:Attributo id HTML DOM

Manuale HTML DOM:Oggetto Style DOM HTML

Esempio

Esempio 1

Usa l'attributo id per modificare un testo tramite JavaScript:

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

Prova tu stesso

Più esempi sono disponibili nella parte inferiore della pagina.

Sintassi

<elemento id="id">

Valore dell'attributo

Valore Descrizione
id

Assegna un id unico all'elemento. Regole di nomina:

  • Deve contenere almeno un carattere
  • Non può contenere spazi

Più esempi

Esempio 2

Usa l'attributo id per collegare a un elemento con un id specifico nella pagina:

<html>
<body>
<h2><a id="top">Un titolo</a></h2>
<p>Molti testi...</p>
<p>Molti testi...</p>
<p>Molti testi...</p>
<a href="#top">Torna in alto</a>
</body>
</html>

Prova tu stesso

Esempio 3

Stilizzare il testo utilizzando l'attributo id con lo stile CSS:

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

Prova tu stesso

Supporto browser

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Supporto Supporto Supporto Supporto Supporto