segun - ¿Cómo copio los datos de un elemento con jQuery?

obtener valor de un boton jquery

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Cuál es la forma más eficiente de clonar un objeto en JavaScript? 55 respuestas

Necesito copiar valores de datos de un elemento a otro, pero el método clone () de jQuery no clona los datos. Y tampoco puedo iterar sobre los datos:

element.data().each

porque data() es una función y no un objeto jQuery. Parece que tengo que mantener una lista separada de los nombres de los atributos y hacer referencia a esos, pero parece demasiado hacky. Entonces, ¿cómo puedo hacer cualquiera de estos:

a) iterar sobre elementos de datos
O
b) clone() un elemento con sus datos.

Answer 1

Respuesta para:

a) iterar sobre elementos de datos

$.each(element.data(), function (name, value) {
    // ... do something
})

Si el elemento es un elemento DOM, usa esto:

$.each($.data(element), function (name, value) {
    // ... do something
})

Answer 2

Algo que originalmente no se respondió como parte de esta pregunta era si deseaba que los atributos de datos formen parte del DOM. El uso de muchas de las respuestas proporcionadas lo hará accesible a la API de datos () de jQuery, pero no estará visible en el DOM (para facilitar la depuración, por ejemplo).

Una forma de hacer esto es:

$.each(original.data(), function (name, value) {
    new.attr(''data-'' + name, JSON.stringify(value));
});

Tenga en cuenta que el stringify no se requiere explícitamente. Tengo un JSON incrustado en mis etiquetas de datos originales y, si no lo hago, obtengo ''[Object object]'' como la cadena en lugar del JSON real.

Answer 3

Para dar otra alternativa, es decir, en lugar de clonar todo el objeto, puede copiar el objeto de datos a una nueva matriz que contenga los pares de nombre / valor siguientes:

function getOriginalElementData(domElementJQueryObject){
    var originalElementData = new Array();
    $.each(domElementJQueryObject.data(),function(name,value) {
       originalElementData.push({"name":name,"value":value});
    });

    return originalElementData;
}

Para restaurar los datos a otro objeto:

function restoreOriginalElementData(domElementJQueryObject,originalElementData){
    for(var i=0;i<originalElementData.length;i++){
        domElementJQueryObject.data(originalElementData[i].name,originalElementData[i].value);
    }
}

La parte para iterar a través de los elementos de datos se copia de esta respuesta: jQuery loop through data () object

Answer 4

Para copiar realmente los datos - *, esto es bastante sencillo:

$(destination).data( $(source).data() );

Esto se debe a que al usar .data () ningún argumento devolverá un objeto de valor clave de todos los datos y viceversa, también puede actualizar datos de varias piezas a la vez utilizando un objeto de valor-clave.

ACTUALIZACIÓN ^{25 de mayo de 2017}

Una alternativa inteligente en JavaScript sin jQuery parece ser:

Object.assign(destination.dataset, source.dataset);