HTML Id

HTML Id

La ruta del desarrollador web frontend autónomo🤹‍♂️


El atributo id se usa para especificar un único id para un elemento HTML.

No puedes tener más de un elemento HTML con el mismo id en un documento HTML.


Uso del atributo id

El atributo id especifica un id para un elemento HTML. El valor del atributo id debe ser único dentro del documento HTML.

El atributo id se usa para apuntar a una declaración de estilo específica en una hoja de estilos. También se utiliza con JavaScript para acceder y manipular el elemento con el id específico.

La sintáxis para id es: escribe un caracter #, seguido por el nombre del id. Luego, define las propiedades CSS dentro de las llaves {}.

En el siguiente ejemplo, tenemos un elemento <h1> que apunta a un nombre id "myHeader". Este elemento <h1> recibirá los estilos de acuerdo al estilo definido en #myHeader.

Ejemplo:

Nota: el nombre id es case-sensitive

Nota: el nombre id debe tener por lo menos un caracter, no puede empezar con número, y no debería contener espacios en blanco.


Diferencias entre class & id

Un nombre de tipo class se puede utilizar por múltiples elementos HTML, mientras que un nombre de tipo id solo se puede utilizar por un solo elemento dentro de la página:

Ejemplo:


Marcadores

Los marcadores HTML se utilizan para permitir a los usuarios saltar a partes específicas de una página web.

Los marcadores pueden ser útiles si tu página es muy grande.

Para usar un marcador, primero debes crearlo, y luego agregar un enlace.

Luego, cuando se haga clic en el enlace, la página se desplazará a la ubicación con el marcador.

Ejemplo:

Primero crea un marcador con el atributo id:

<h2 id="#C4">Capitulo 4</h2>

Luego, agrega un enlace al marcador dentro de la misma página:

<a href="#C4">Ir al capítulo 4</a>

O, agrega un enlace al marcador desde otra página:

<a href="html_demo.html#C4">Ir al capitulo 4</a>

Uso de id en JavaScript

JavaScript también puede usar el atributo id para realizar algunas tareas para un elemento específico.

JavaScript puede acceder a un elemento con un id específico mediante el método getElementById():

Ejemplo:


Resumen

  • El atributo id se usa para especificar un id único para un elemento HTML.

  • El valor del atributo id debe ser único dentro del documento HTML.

  • El atributo id es utilizado por CSS y JavaScript para diseñar y/o seleccionar un elemento específico.

  • El valor del atributo id es case-sensitive.

  • El atributo id también se usa para crear marcadores HTML.

  • JavaScript puede acceder a un elemento con un id específico mediante el método getElementById().


Traducido con 💚 desde W3Schools.com

Did you find this article valuable?

Support Santos Romero by becoming a sponsor. Any amount is appreciated!