減少大量重複代碼的HTML頁面的大小

Question

Noob問題在這裏，但我還沒有找到其他地方的直接答案。我已經寫在燒瓶內的Web應用程序上的要求產生非常多的選擇框下面的代碼：

{% for hour in hours %} 
    <tr> 
     <td>{{ hour }}</td> 
     {% for date in dates %} 
     <td> 
     <div id="select_{{ date }}_{{ hour }}" style="display:none;"> 
      <select name={{ "time" + "_" + date + "_" + hour }}> 
       <option value="00" >{{ hour }}:00</option> 
       <option value="15" >{{ hour }}:15</option> 
       <option value="30" >{{ hour }}:30</option> 
       <option value="45" >{{ hour }}:45</option> 
      </select>  
      <select onchange="this.form.submit()" name={{ "value" + "_" + date + "_" + hour }}> 
      {% for option in options %} 
      <option value="{{ option|safe }}" > 
       {{ option|safe }} 
      </option> 
      {% endfor %} 
      </select> 
     </div> 
     <div id="plus_{{ date }}_{{ hour }}" style="display:block;"> 
      <a href="javascript:;show_select('{{ date }}', '{{ hour }}')" onClick="">+</a> 
     </div> 
     </td> 
     {% endfor %} 
    </tr> 
    {% endfor %} 

其中dates和hours顯然是使用日期和時間列表，options是一個有很多的列表的選項。總而言之，我的HTML文檔最終大小超過1 MB。如果我想縮小這個尺寸，我有什麼選擇？

感謝， 菲利普

Answer 1

可以將此模板轉換一些JavaScript代碼，反覆做document.write或設置不同元素的innerhtml財產。在HTML5中，您可以使用template tag。模板支持由許多庫提供，例如jquery，mustache等，可能使用上述技術實現。