你如何在JS / HTML中做一个dynamic的循环,就像你在Jade中一样?

我去了所有我的显示代码在HTML中,具有真正的具体属性和东西放在里面,不幸的是,所有的教程,我显示模板只显示它为翡翠。

我想用HTML和Javascript来做。

我将如何去做

ul each val in [1, 2, 3, 4, 5] li= val 

在HTML / JS?

它是否比任何更复杂的比只是有一个for循环推动标签周围的string,当它低于xvariables我从我的数据库拉,或者我错过了什么?

在学习的时候,我想保持我的抽象不高于Javascript,HTML,CSS,Node.js和Mongodb。

你可以纯粹用JavaScript来做到这一点。

首先简单地写一个

 function call(n){ //Accessing the ul element var main = document.getElementById("main"); for(var i=0;i<n;i++){ var child = document.createElement("li"); //if you want to add data to your li child.innerHTML = i+1; //appending the child to the main ul main.appendChild(child); } } 

在这里,'n'是你想要生成的li的数量。

这里是一个演示

你可以像这样dynamic创build元素。

https://jsfiddle.net/scheda/5p5nhdxh/

 var thing = document.getElementById('thing'); var things = [1,2,3,4,5]; things.forEach(function(v) { thing.innerHTML += "<li>" + v +"</li>"; });