Datos HTML-* Atributo


Definición y uso

El data-*atributo se usa para almacenar datos personalizados privados para la página o la aplicación.

El data-*atributo nos brinda la capacidad de incrustar atributos de datos personalizados en todos los elementos HTML.

Los datos almacenados (personalizados) se pueden usar en el JavaScript de la página para crear una experiencia de usuario más atractiva (sin llamadas Ajax ni consultas a la base de datos del lado del servidor).

El data-*atributo consta de dos partes:

  1. El nombre del atributo no debe contener letras mayúsculas y debe tener al menos un carácter después del prefijo "datos-".
  2. El valor del atributo puede ser cualquier cadena.

Nota: el agente de usuario ignorará por completo los atributos personalizados con el prefijo "data-".


Se aplica a

El data-*atributo es un atributo global y se puede utilizar en cualquier elemento HTML.

Elemento Atributo
Todos los elementos HTML datos-*

Ejemplo

Ejemplo

Utilice el atributo data-* para incrustar datos personalizados:

<ul>
  <li data-animal-type="bird">Owl</li>
  <li data-animal-type="fish">Salmon</li>
  <li data-animal-type="spider">Tarantula</li>
</ul>

Compatibilidad con navegador

Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el atributo.

Attribute
data-* 4.0 5.5 2.0 3.1 9.6