Buscar..


Sintaxis

  • <element data-custom-name="somevalue">

Parámetros

Valor Descripción
algún valor Especifica el valor del atributo (como una cadena)

Uso de atributos de datos

Los atributos de data-* HTML5 proporcionan una manera conveniente de almacenar datos en elementos HTML. Los datos almacenados se pueden leer o modificar usando JavaScript

<div data-submitted="yes" class="user_profile">
  … some content …
</div>
  • La estructura del atributo de data-* es data-* , es decir, el nombre del atributo de datos viene después de la parte de data- . Usando este nombre, se puede acceder al atributo.

  • Los datos en formato de cadena (incluido json ) se pueden almacenar utilizando el atributo data-* .

Soporte de navegadores antiguos

Los atributos de datos se introdujeron en HTML5, que es compatible con todos los navegadores modernos, pero los navegadores más antiguos antes de HTML5 no reconocen los atributos de datos.

Sin embargo, en las especificaciones HTML, los atributos que no son reconocidos por el navegador deben dejarse solos y el navegador simplemente los ignorará al renderizar la página.

Los desarrolladores web han utilizado este hecho para crear atributos no estándar que son atributos que no forman parte de las especificaciones HTML. Por ejemplo, el atributo de value en la línea siguiente se considera un atributo no estándar porque las especificaciones para la etiqueta <img> no tienen un atributo de value y no es un atributo global:

<img src="sample.jpg" value="test" />

Esto significa que aunque los atributos de datos no son compatibles con los navegadores más antiguos, siguen funcionando y puede configurarlos y recuperarlos utilizando los mismos métodos genéricos de setAttribute y getAttribute setAttribute JavaScript, pero no puede usar la nueva propiedad de dataset que solo se admite en los navegadores modernos.



Modified text is an extract of the original Stack Overflow Documentation
Licenciado bajo CC BY-SA 3.0
No afiliado a Stack Overflow