javascript html объектная модель и шаблонизатор

Question

Я ищу библиотеку JavaScript, которая может делать что-то вроде

var items = [1,2];
var html = div(
ul({id:"some-id", class:"some-class"})(items.each(function(item){
 return li(item);
})
);

html == "<div><ul id='some-id' class='some-class'><li >1</li><li>2</li></ul></div>"

Answer 1

Если вы хотите использовать jQuery :

var $ul = $('<ul />',{
    "class":" some-class",
    "id": "some-id"
});
$.each(items,function(index,value) {
    $('<li />').text(value).appendTo($ul);
});
$ul.appendTo($('body'))

Хотя в этом случае вы можете сделать это и на чистом javascript:

var ul = document.createElement('ul');
    ul.setAttribute('id',   'some-id');
    ul.setAttribute('class','some-class');
for(var i in items)
{
    var li = document.createElement('li');
        li.innerText = items[i];
    ul.appendChild(li);
}
document.body.appendChild(ul)

Answer 2

Взгляните на метод supplant () Дугласа Крокфорда:

param = {domain: 'valvion.com', media: 'http://media.valvion.com/'};
url = "{media}logo.gif".supplant(param);

Answer 3

Итак, я пишу это сам. http://jshtmlbuilder.codeplex.com/

Answer 4

У Джона Ресига отличная шаблон система. Пример, который он использует для иллюстрации своих возможностей, - именно то, что вы хотите сделать.

Вы можете использовать скрипт со следующим синтаксисом для создания желаемого результата:

<script type="text/html" id="user_tmpl">
  <% for ( var i = 0; i < users.length; i++ ) { %>
    <li><a href="<%=users[i].url%>"><%=users[i].name%></a></li>
  <% } %>
</script>

И передайте данные с помощью следующего вызова в JavaScript:

var results = document.getElementById("results");
results.innerHTML = tmpl("item_tmpl", dataObject);