Atributo de identificación HTML


Ejemplo

Use el atributo id para manipular texto con JavaScript:

<html>
<body>

<h1 id="myHeader">Hello World!</h1>
<button onclick="displayResult()">Change text</button>

<script>
function displayResult() {
  document.getElementById("myHeader").innerHTML = "Have a nice day!";
}
</script>

</body>
</html>

Más ejemplos de "Pruébelo usted mismo" a continuación.


Definición y uso

El idatributo especifica una identificación única para un elemento HTML (el valor debe ser único dentro del documento HTML).

El idatributo se usa principalmente para apuntar a un estilo en una hoja de estilo, y JavaScript (a través de HTML DOM) para manipular el elemento con la identificación específica.


Compatibilidad con navegador

Attribute
id Yes Yes Yes Yes Yes

Sintaxis

<element id="id">

Valores de atributos

Value Description
id Specifies a unique id for the element. Naming rules:
  • Must contain at least one character
  • Must not contain any space characters

Más ejemplos

Ejemplo 1

Use el atributo id para vincular a un elemento con una identificación específica dentro de una página:

<html>
<body>

<h2><a id="top">Some heading</a></h2>

<p>Lots of text....</p>
<p>Lots of text....</p>
<p>Lots of text....</p>

<a href="#top">Go to top</a>

</body>
</html>

Ejemplo 2

Use el atributo id para diseñar texto con CSS:

<html>
<head>
<style>
#myHeader {
  color: red;
  text-align: center;
}
</style>
</head>
<body>

<h1 id="myHeader">W3Schools is the best!</h1>

</body>
</html>

páginas relacionadas

Tutorial de HTML: ID de HTML

Tutorial HTML: Atributos HTML

Tutorial CSS: Sintaxis CSS

Referencia de CSS: Selector de CSS #id

Referencia HTML DOM: Método HTML DOM getElementById()

Referencia de HTML DOM: Propiedad de id de HTML DOM

Referencia HTML DOM: objeto de estilo HTML DOM