El elemento de datos `` en HTML5 es usado para asociar una traducción de texto con una máquina-legible de valor numérico o de cadena. Esto puede ser útil en diversas situaciones, como cuando se necesita mostrar información que es mejor entendida en un formato diferente al que se utiliza internamente.
A continuación se muestra un ejemplo de cómo utilizar el elemento de datos en HTML5:
```html
Código de producto
```
En este ejemplo, el valor “501239” representa el código de producto en formato legible por la máquina, mientras que “Código de producto” es la versión legible por humanos.
Sin embargo, este elemento no tiene un impacto visual en la página cuando se representa en un navegador. Por lo tanto, el elemento de datos se utiliza más a menudo en conjunción con JavaScript para manipular o extraer datos en la página.
```javascript
let codigo = document.querySelector(‘data’).value;
alert(codigo); // Muestra un pop-up con el mensaje “501239“
```
En el ejemplo anterior, JavaScript se utiliza para seleccionar el elemento de datos en la página y extraer su valor, que luego se muestra al usuario en un cuadro de alerta.
Recuerda que el valor de los datos debe representar la misma información que los contenidos del elemento y que CSS no afectará directamente al atributo de valor del elemento.
Además, ten en cuenta que el soporte para esta etiqueta HTML5 puede variar en diferentes navegadores.
