Tipos de atributos
Aunque cada una de las etiquetas HTML define sus propios atributos, encontramos algunos comunes a muchas o casi todas las etiquetas, que se dividen en grupos según su funcionalidad:
- Atributos básicos
- Atributos de eventos
- Atributos de foco
Atributos básicos
Los atributos básicos se utilizan en la mayoría de etiquetas HTML, aunque adquieren mucho mayor importancia cuando se utilizan hojas de estilo CSS:
| Atributo | Descripción |
|---|---|
| id="texto" | Establece un indicador único a cada elemento |
| class="texto" | Establece la clase CSS que se aplica a los estilos del elemento |
| style="texto" | Aplica de forma directa los estilos CSS de un elemento |
| title="texto" | Establece el título del elemento (Mejora la accesibilidad) |
Atributos de eventos
Estos atributos se utilizan en las páginas web que incluyen código JavaScript para realizar acciones dinámicas sobre los elementos de la página.
| Atributo | Descripción (se usa en todos los elementos) |
|---|---|
| onclick | Ejecuta la acción cuando se realiza un clic sobre el elemento |
| ondblclick | Ejecuta la acción cuando se realiza un doble clic sobre el elemento |
| onmousedown | Ejecuta la acción cuando se detecta el botón pulsado del ratón |
| onmouseup | Ejecuta la acción cuando se detecta que se ha soltado el botón del ratón |
| onmousemove | Ejecuta la acción cuando se detecta el movimiento del ratón sobre el elemento |
| onmouseout | Ejecuta la acción cuando el ratón abandona el elemento |
| onmouseover | Ejecuta la acción cuando se detecta que el ratón se sitúa sobre el elemento |
| Atributo | Descripción (se usa con body) |
|---|---|
| onload | Ejecuta la acción cuando se carga el documento |
| onunload | Ejecuta la acción cuando se abandona el documento |
| onresize | Ejecuta la acción cuando se ha modificado el tamaño de la ventana del navegador |
| Atributo | Descripción (se usa con form y body) |
|---|---|
| onkeydown | Ejecuta la acción cuando se detecta que la tecla esta pulsada |
| onkeyup | Ejecuta la acción cuando se detecta que se ha soltado la tecla pulsada |
| onkeypress | Ejecuta la acción cuando se pulsa una tecla |
| Atributos | Descripción | Se puede usar con |
|---|---|---|
| onblur | Ejecuta la acción cuando el elemento pierde el foco bien sea a través del ratón o por navegación tabulada | button, input, label, select, textarea, body |
| onfocus | Ejecuta la acción cuando el elemento obtiene el foco bien sea a través del ratón o por navegación tabulada | button, input, label, select, textarea, body |
| onchange | Ejecuta la acción cuando el valor de un control ha sido modificado | input, select, textarea |
| onreset | Ejecuta la acción cuando el formulario es restablecido a sus valores por defecto | form |
| onselect | Ejecuta la acción cuando un usuario selecciona texto en un campo de texto | input, textarea |
| onsubmit | Ejecuta la acción cuando el formulario es enviado | form |
Atributos de foco
| Atributo | Descripción |
|---|---|
| accesskey="letra" | Establece una tecla de acceso rápido a un elemento HTML |
| tabindex="numero" | Establece la posición del elemento en el orden de tabulación de la página (valor entre 0 y 32.767) |
| onfocus, onblur | Controlan los eventos JavaScript que se ejecutan cuando el elemento obtiene o pierde el foco |