मैं HTML पृष्ठ के भीतर HTML टेम्पलेट को सही ढंग से कैसे संग्रहीत कर सकता हूं?

मेरे पास कुछ छोटे टेम्पलेट स्ट्रिंग हैं, जिन्हें एक ही पृष्ठ पर Mustache.js के माध्यम से प्रस्तुत किया जाएगा। मुझे टेम्पलेट्स के लिए अलग HTML फ़ाइलों को बनाने की आवश्यकता नहीं है। टेम्पलेट्स के भंडारण के लिएमैं HTML पृष्ठ के भीतर HTML टेम्पलेट को सही ढंग से कैसे संग्रहीत कर सकता हूं?

विकल्प:

जावास्क्रिप्ट चर में संग्रहीत: hackish बहु तार, उद्धरण के बचने की बहुत सारी।
छिपे हुए divs के आंतरिक HTML के रूप में संग्रहीत।

मैंने विधि # 2 की कोशिश की, लेकिन यह सही ढंग से काम नहीं कर रहा है।

फिडल: http://jsfiddle.net/RHwnq/2/

<html> 
<head></head> 
<body> 
<div id='templates' class='hide' align=""> 
     <div id='tableTemplate'> 
      <table class="table"> 
       {{#name_list}} 
        <tr><td> {{name}} </td></tr> 
       {{/name_list}} 
      </table> 
     </div> 
</div> 

<script> 
var template = $('#tableTemplate').html(); 
console.log(template); 
</script> 

</body> 
</html>

इस लॉग्स:

{{#name_list}} 
    {{name}} 
{{/name_list}} 
<table class="table"><tbody><tr><td></td></tr></tbody></table>

बजाय

<table class="table"> 
        {{#name_list}} 
         <tr><td> {{name}} </td></tr> 
        {{/name_list}} 
    </table>

यह ब्राउज़र से कुछ मार्कअप सुधार के कारण हो सकता है। एचटीएमएल टेम्पलेट्स को एचटीएमएल पेज में स्टोर करने के लिए अन्य अच्छी चाल क्या हैं?

स्रोत

2012-11-28 DhruvPathak

उन्हें उसी फ़ाइल में संग्रहीत करने के बारे में क्या नहीं है, लेकिन उन्हें AJAX के माध्यम से लोड करना है? – feeela

@feeela no, मैं 2-3 छोटे तारों को लोड करने के लिए AJAX कॉल नहीं करना चाहता, मैं उन्हें उसी पृष्ठ में स्टोर करना चाहता हूं। – DhruvPathak

backbone.js/underscore.js से संबंधित कुछ ट्यूटोरियल में उन्होंने टेम्पलेट्स को <स्क्रिप्ट टाइप = "टेक्स्ट/टेम्पलेट" आईडी = "टेम्पलेट-आईडी"> टैग में संग्रहीत किया। इस सवाल पर नज़र डालें: http://stackoverflow.com/questions/4912586/explanation-of-script-type-text-template-script – Marc

मैं उन्हें एक स्क्रिप्ट टैग में संग्रहीत करते हैं, तो वे गाया नहीं मिलता, इस तरह:

<script id="abc-template" type="text/html"> 
    <h1>{{name}}</h1> 
</script>

फिर आप उन्हें इस तरह देख सकते हैं:

var template = $('#abc-template').html(); 
var html = Mustache.to_html(template, data); 
$('#abc-div').html(html);

स्रोत

2012-11-28 11:46:44

हा, सेकेंड के मामले में एक ही समाधान :) –

एफएमएल ने मुझे बचाया पूरा दिन। – Worthy7

<script> टैग का उपयोग करना अच्छा काम करता है इसके लिए:

<script id="tableTemplate" type="text/html"> 
    <table class="table"> 
    {{#name_list}} 
    <tr><td> {{name}} </td></tr> 
    {{/name_list}} 
    </table> 
</script>

यह वास्तव में एक ड्रॉप-इन प्रतिस्थापन है, यह आपकेके साथ काम करेगा

स्रोत

2012-11-28 11:47:18

आपके आईडीई के आधार पर, आप <script></script> ब्लॉक के भीतर HTML सिंटैक्स हाइलाइटिंग प्राप्त कर सकते हैं या नहीं। मैं एक div ब्लॉक का उपयोग के रूप में आप था, लेकिन सीएसएस के लिए

#templates {display: none;}

जोड़ें।

स्रोत

2017-08-17 18:17:30 abalter

मैं HTML पृष्ठ के भीतर HTML टेम्पलेट को सही ढंग से कैसे संग्रहीत कर सकता हूं?

उत्तर

संबंधित मुद्दे