Javascript - альтернатива HTML конкатенации

Question

Можно создать дубликат:
JavaScript: How should I generate a lot of HTML?

Я чувствую себя очень глупо делать что-то вроде этого:

var html = '<div><ul>'; 
for(var i=0; i<10; i++) { 
    html += '<li>' + i + '</li>'; 
} 
html += '</ul></div>'; 
$("body").html(html); 

не способ использовать шаблоны вместо конкатенации таких строк? Я знаю, что есть возможность заселения существующих элементов с помощью JS и изменения отображения для блокировки, когда они должны появляться, но это кажется довольно хакерским и раздражающим, особенно при использовании циклов.

Я открыт для любых внешних интерфейсных шаблонов и предложений.

Этот вопрос, вероятно, был задан раньше, но я не мог найти никаких подсказок о SO. Любое понимание было бы весьма благодарным.

EDIT:

Чтобы уточнить, я был бы заинтересован в чем-то вроде этого:

// li_list.haml 
%div 
    %ul 
     - for i in #{range} 
     %li i 

// app.js 
// require li_list.haml with {range: 10} 

Answer 1

Вы можете определенно использовать шаблоны, но это потребует внешнюю библиотеку.

Лично мне нравится KnockoutJs, у которого есть шаблоны, двусторонняя привязка к dom и другие лакомства. Вот их demo on templating

Answer 2

Попробуйте Prototype Template.

Возможно, вы также захотите попробовать Closure JS templates.

Answer 3

Я знаю, что он не был помечен, но, видя, что ваш вопрос выглядит так: jQuery имеет tmpl plugin, указанный в документации по API.

Для решения без jquery у Jon Resig есть great article about his micro-templating technique.

Наконец, если вы просто конкатенации кучу вещей, массивы творить чудеса:

Вместо того, чтобы:

var html = '<div><ul>'; 
for(var i=0; i<10; i++) { 
    html += '<li>' + i + '</li>'; 
} 
html += '</ul></div>'; 
$("body").html(html); 

Вы могли бы использовать:

var html, 
    i; 
html = ['<div><ul>']; 
for (i = 0; i < 10; i += 1) { 
    html.push('<li>', i, '<li>') 
} 
html.push('</ul></div>'); 
$('body').html(html.join('')); 

Не существенная разница , но по крайней мере вы можете выполнять манипуляции с массивами.