Posso memorizzare gli attributi personalizzati in HTML DOM come un record del database?

Question

Durante lo sviluppo per i browser FF3 e IE6/7 con jQuery, ci sono problemi di compatibilità quando si impostano gli attributi personalizzati sui tag HTML?

In primo luogo, sono a conoscenza della funzione data() di jQuery e essenzialmente fa ciò che voglio, ma i dati non sopravvivono alla funzione clone(). Questo è un problema quando si usano i plugin draggable/droppable dell'interfaccia utente jQuery perché clona elementi DOM durante un trascinamento/rilascio. Ai fini di questa domanda, ho bisogno di un'alternativa a data().

Desidero mantenere i dati tra operazioni di trascinamento/rilascio. Voglio essere in grado di iniettare dati nell'elemento DOM che viene spostato durante un'operazione di trascinamento. Per fare ciò, posso creare elementi figlio HTML per simulare un record del database. La sperimentazione rapida mostra che Firefox non ha problemi utilizzando i nomi di attributi che voglio memorizzare campi di dati. Tuttavia, la specifica HTML 4 afferma che alcuni tag possono contenere solo determinati nomi di attributi. Il popolamento del DOM con attributi non standard causerà problemi di incompatibilità con i browser che ho menzionato?

Answer 1

Date un'occhiata a questa domanda simile ho chiesto a un dal retro: Can I just make up attributes on my HTML tags?

Personalmente, non mi piacciono molto le risposte suggerite di mettere tutti i dati nell'attributo di classe. Sembra, solo ... sbagliato, sai? Nella mia esperienza, sebbene la tua pagina non sia valida se componi gli attributi, lo faccio comunque. Provalo nei 4 principali browser e se funziona, a chi importa?

La soluzione migliore che posso pensare è quella che non è valida ora, ma sarà in HTML5, quindi va bene. Come suggerito da ms2ger in quel altra questione, prefisso attributi vostra abitudine con data-

http://www.whatwg.org/specs/web-apps/current-work/multipage/dom.html#embedding-custom-non-visible-data

Answer 2

Dai un'occhiata alla http://www.persvr.org/

Perseverate dispone di un nuovo motore di storage oggetto nativo chiamato JavaScriptDB che fornisce scalabilità di fascia alta e le prestazioni

http://ajaxian.com/archives/perseveres-javascriptdb-impressive-json-performance

Answer 3

Assente qualche modo standard per fare questo in HTML4, sarei tentato di creare un elemento nascosto che corrisponde al mio trascinabili e negozio i dati associati in esso. Assegna un nome all'elemento nascosto relativo al trascinamento in modo da poter facilmente cercare le informazioni per esso. La seguente estensione implementa questo usando un intervallo nascosto. Nota: nel test non sono riuscito a replicare i tuoi problemi con gli elementi trascinabili: data() sembrava funzionare bene per me, ma non l'ho testato con vari plugin, solo UI.Draggable.

Usage:

$('#draggableDiv').externalData('key','data'); 
var d = $('#draggableDiv').externalData('key'); 

jQuery.fn.externalData = function(key, data) { 
    var value = this; 
    this.each(function() { 
     var id = this.id+'_external_data'; 
     var elem = jQuery('#'+id+':first'); 
     if (elem.size() == 0) { 
      elem = $('<span style="display: none;" id="' + id + '"></span>"'); 
      elem.appendTo(document.body); 
     } 
     if (data) { 
      elem.data(key,data); 
     } 
     else { 
      value = elem.data(key); 
      return false; 
     } 
    }); 
    return value; 
}; 

Answer 4

I nuovi attributi di dati HTML 5 potrebbe essere quello che stai cercando.

http://ejohn.org/blog/html-5-data-attributes/

http://dev.w3.org/html5/spec/Overview.html#custom

Answer 5

Questo è relativamente sconosciuto, ma piuttosto dang utile: jQuery Metadata Plugin. Ti permetterà di memorizzare i dati all'interno dei nomi delle classi per il recupero. È in gran parte utilizzato per il plugin di validazione ma, in realtà, può essere adattato a qualsiasi scenario.

Buona fortuna con qualunque cosa stiate lavorando.