javascript modèle objet html et le moteur modèle

Question

Je cherche librairie javascript qui peut faire quelque chose comme

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

Alors, je l'écris par moi-même. http://jshtmlbuilder.codeplex.com/

Answer 2

Jetez un oeil à la méthode de Douglas Crockford supplant():

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

Answer 3

Si vous souhaitez utiliser jQuery :

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

Bien que dans ce cas, vous pouvez le faire dans javascrip pur t aussi:

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 4

John Resig a un grand système template. L'exemple qu'il utilise pour illustrer sa capacité est exactement ce que vous voulez faire.

Vous pouvez utiliser un script avec la syntaxe suivante pour créer la sortie que vous voulez:

<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> 

et le nourrir des données avec l'appel suivant en javascript:

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