jQuery जटिल रूप से जटिल HTML टुकड़े बनाने के लिए

Question

मैं जेएसओएन डेटा के साथ किसी प्रकार का टेम्पलेट जेनरेट करना चाहता हूं और कम से कम एक सूची में संलग्न करना चाहता हूं) jQuery का उपयोग कर अर्ध-जटिल HTML div तत्व। डेटा जेएसओएन प्रारूप में है (यदि यह मायने रखता है) और प्रत्येक अभिभावक प्रविष्टि के लिए मैं एक कैरोसेल-प्रकार तत्व में एक और div जोड़ना चाहता हूं।

एक लंबे बयान जैसे:

$('#list').append('<li><div id=" + entry.id +"><span id="highlight> + entry.name + <span/><div id="picture" .... 

(वहाँ बहाना त्रुटियों यह सिर्फ एक बिंदु बनाने के लिए है) काम करते हैं लेकिन बनाए रखने के लिए बहुत कठिन है जाएगा। एक और अधिक प्रभावी तरीका होना चाहिए।

धन्यवाद।

Answer 1

आप जावास्क्रिप्ट templating भाषाओं में देख रहे हैं - वहाँ टन वहाँ बाहर हैं:

• underscore.js;
• mustache.js;
• jade;
• handlebars.js;

  <p>Hello <strong><%=user.name %> <%=user.lastname %></strong></p> 
  

  द्वारा:

  var myUser = { name : 'John', lastname : 'Doe' }; 
  
  $('#awesomeDiv').html(
      someTemplateFunction({ user : myUser }) 
  ); 
  

  और someTemplateFunction() की तरह अपने शरीर में कुछ का आयोजन करेगा:

• कई और अधिक ...

विचार डेटा और उसके अलग दृश्य रखना है होल्डिंग मेरा मतलब है कि टेम्पलेट लाइब्रेरी ऐसे टेम्पलेट को पार्स करने में सक्षम है [डीओएम से या बाहरी फाइल से आ रही है] और इसे नए डोम तत्वों में प्रस्तुत करने के लिए।

मेरा चयन underscore.js है क्योंकि यह एक बहुत ही कम अभी तक उपयोगी लाइब्रेरी है, इसे देखने के लिए स्वतंत्र महसूस करें।

Answer 2

आप कुछ templating के लिए देख रहे हैं। वहाँ कई हैं:

• Handlebars
• Hogan
• dust.js
• Mustache
• underscore templates
• jQuery templates

Answer 3

अगर यह तुम क्या करने के लिए काम करेंगे पता नहीं है ' फिर से कर रहा है लेकिन हाल ही में मुझे एक समान समस्या थी और मैं अपने जेएस को एचटीएमएल के साथ डालने के लिए 'ध्रुवीय' नहीं करना चाहता था। मेरा समाधान पृष्ठ में सभी एचटीएमएल डालने और इसे छिपाने देना था ताकि जब आवश्यक हो, मैं इसे प्रकट कर सकता हूं या, कुछ मामलों में, मैं वांछित div की प्रतिलिपि बना सकता हूं।