Método data

El método data permite vincular datos de cualquier tipo a elementos DOM de forma segura, evitando fugas de memoria. Podemos establecer varios valores diferentes para un elemento y obtenerlos más tarde. El uso del método data para actualizar datos no afecta a los atributos en el DOM.

Sintaxis

Así establecemos un valor para un elemento con una clave, por la cual se podrá encontrar más tarde:

javascript.data(clave, valor);

También podemos pasar un objeto que contenga pares clave-valor para actualizar los datos:

javascript.data(objeto);

Se pueden obtener los datos asociados con el primer elemento en la colección jQuery pasando solo la clave:

javascript.data(clave);

Sin pasar ningún parámetro, podemos leer los datos previamente vinculados a los elementos DOM. El método devolverá un objeto JavaScript, que contiene cada valor como propiedad:

javascript.data();

Ejemplo

Usemos data para establecer datos para la etiqueta p, pasando como primer parámetro 'test' y el valor 21 como segundo. Luego leamos los datos guardados con la clave 'test':

html<p>texto</p>
javascript$('p').data('test', 21); // aquí se escriben los datos

console.log($('p').data('test')); // mostrará el número 21
console.log($('p').data()); // mostrará el objeto {test: 21}

Véase también

  • método removeData,
    que elimina datos del elemento
  • método hasData,
    que verifica la presencia de datos en el elemento
  • método attr,
    que permite obtener y cambiar cualquier atributo del elemento
  • Propiedad JavaScript dataset,
    que permite agregar atributos personalizados a las etiquetas