什么是使用javascript对象重复html代码的最佳方式？

Question

使用一些JS对象像

links = { 
    link1: "Text1", 
    link2: "Text2", 
    link3: "Text3" 
}; 

我想创建键和值的内容与href几个<a>元素，如

<a href="link1">Text1</a> 
<a href="link2">Text2</a> 
<a href="link3">Text3</a> 

什么是最好的，用做它的最短路径JS或一些流行的JS框架？

Answer 1

你想在javascript中使用for循环。

HTML：

<p id="demo" /> 

JS：

links = { 
    link1: "Text1", 
    link2: "Text2", 
    link3: "Text3" 
}; 

var element, filling = ""; 
for (element in links) { 
    filling += "<a href=\"{0}\">{1}</a>" 
     .replace("{0}", element) 
     .replace("{1}", links[element]); 
} 

document.getElementById("demo").innerHTML = filling; 

在这里看到演示：http://jsfiddle.net/0subxy9m/1/

Answer 2

与角例如，你的链接对象

HTML

<li ng-repeat="(link,text) in links"> 
    <a href="http://example.com/{{link}}">{{text}}</a> 
</li> 

JS

$scope.links = { 
    link1: "Text1", 
    link2: "Text2", 
    link3: "Text3" 
}; 

plnkr demo here