jquery, allegando oggetti (anziché attributo stringa) a un elemento

Question

Sto provando a creare DOM con jQuery e riempirlo con i dati ricevuti con AJAX (tipo di dati = json). Mi piacerebbe anche archiviare questi dati come un oggetto, collegato a un elemento DOM specifico. JQuery fornisce un metodo per questo? La ragione per cui voglio farlo è perché viene visualizzata inizialmente solo una parte dei dati; altri dati potrebbero essere necessari in seguito, a seconda delle azioni dell'utente.

Ho provato ad utilizzare attr(), ma memorizza una stringa "[object Object]" invece di un oggetto attuale:

var div = $('<div/>'); 
div.attr('foo', {bar: 'foobar'}); 
alert(div.attr('foo')); // gives "[object Object]" 
alert(typeof div.attr('foo')); // gives "string" 
alert(div.attr('foo').bar); // gives "undefined" 

Un altro modo per fare questo sarebbe da "bypassando" jQuery (div[0].foo = {bar: 'foobar'};), sebbene questa sembra essere una "soluzione sporca", se jQuery capita di supportare già gli allegati.

Qualche idea? Grazie in anticipo!

Answer 1

È possibile utilizzare .data() a tal fine, in questo modo:

div.data('foo', { bar: 'foobar' }); //sets it 
var obj = div.data('foo'); //gets it 

You can see your example code working here just by changing .attr() to .data():

var div = $('<div/>'); 
div.data('foo', {bar: 'foobar'}); 
alert(div.data('foo')); // gives "[object Object]" 
alert(typeof div.data('foo')); // gives "object" 
alert(div.data('foo').bar); // gives "foobar"​​​​​​​​​​​​​​ 

Answer 2

vi suggerisco di utilizzare i dati metodo dell'oggetto jQuery. In questo modo è possibile allegare dati personalizzati (JSON) al rispettivo elemento DOM. Ecco il codice di esempio:

jQuery("div").data("key", /* JSON object */); 

successivamente è possibile ottenere i dati associati nel modo seguente:

var data = jQuery("div").data("key");