Verwendung der .data() Methode in jQote - clientseitige Templating Plugin

Question

In den letzten Wochen habe ich jQote – client-side templating Plugin verwendet, um HTML-Fragmente in der Laufzeit zu generieren.

Seit Monaten verwende ich die Dom-Attribute wie, ID, Klasse, alt, um kritische Daten zu speichern.

Nun habe ich über .data() Methode in Jquery zum Speichern und Abrufen von Daten kennen gelernt.

Überall in meinem Projekt erzeuge ich HTML-Fragmente dynamisch mit Vorlagen.

Jetzt muss ich wissen, wie ich .data() in diesen Vorlagen dynamisch verwenden und kritische Daten in jedem dynamisch erstellten Element speichern kann.

Die Vorlage js-Code ist wie diese,

var template = templateCache.idOfTheTemplate; // say its a <li> 
for(var i = 0; i < length; i ++){ 
$("#ulID").jqotepre(template, data); 
} 

Vorlage:

<script id="idOfTheTemplate" type="text/template"> 
<li id="<%=this.id%>">//here i want to use .data() and store the id with different key 
<a id="<%=this.id%>" href="#"><%=this.linkName%></a> 
</li> 
</script> 

Lösung:

$("#ulID").jqotepre(template, data); 

Nach dieser Zeile ausgeführt wurde, dass das Element zur Verfügung steht im DOM.

Also, Sie können dies nur tun,

$("#ulID").jqotepre(template, data); 
$('#' + data.id).data('liInfo', data);//data.id is the ID of the li element in the DOM 

Answer 1

Die .data() Funktion in JQuery funktioniert auf html5-Datenelemente.

Bedeutung

<li id="myId" data-food="value" > 

ist die gleiche wie

$("#myId").data('food', 'value'); 

Sie können mehr über html5 Datenelemente bei http://html5doctor.com/html5-custom-data-attributes/

und mehr auf JQuerys Datenlesefunktion bei http://api.jquery.com/jQuery.data/