Javascript 对于带有jQuery append的循环中的

Javascript 对于带有jQuery append的循环中的,javascript,jquery,for-loop,for-in-loop,Javascript,Jquery,For Loop,For In Loop,我还不熟悉学习循环,所以我有点困惑。我有一个for…in循环,循环对象的json文件。然后我让jQuery为每个对象创建一些html元素。但我有一个问题,每次循环时,它都会重复前面的对象和新对象,因此输出变为: -name -name -test -name -test -someone -name -test -someone -something 但我正在努力 -name -test -someone -something 我怎样才能做到这一点 我目前的代码是: var ht

我还不熟悉学习循环,所以我有点困惑。我有一个
for…in
循环,循环对象的json文件。然后我让jQuery为每个对象创建一些html元素。但我有一个问题,每次循环时,它都会重复前面的对象和新对象,因此输出变为:

-name

-name
-test

-name
-test
-someone

-name
-test
-someone
-something
但我正在努力

-name

-test

-someone

-something
我怎样才能做到这一点

我目前的代码是:

var html = ""
for (var name in urls) {
    html += `<div class='card-panel white'><div class='container'><div class='row'><div class='input-field col s12'> ${name} <br> ${urls[name].url} </div></div></div></div>`
    $("#main").append(html)
}
var html=“”
for(URL中的变量名称){
html+=`${name}
${url[name].url}` $(“#main”).append(html) }
您在每次迭代中追加HTML字符串,而不是在for循环之外追加整个代码。尽管使用仅用于获取


${name}
这部分是如何工作的?有新到ES6的人吗?你能把我链接到相关的文档吗?@RajaprabhuAravindasamy@RajaprabhuAravindasamy:是的,这是OP使用的模板字符串的一个特性。我现在觉得非常愚蠢@就生产率而言,RajaprabhuAravindasamy模板字符串比普通方式要好得多。谢谢你的回答。在允许的情况下,我会将答案标记为正确(时间限制)。
var html = ""
for (var name in urls) {
  if(urls.hasOwnProperty(name))
    html += `<div class='card-panel white'><div class='container'><div class='row'><div class='input-field col s12'> ${name} <br> ${urls[name].url} </div></div></div></div>`;
}
$("#main").append(html)
$("#main").append(
  Object.keys(urls).map(function(name){
    return `<div class='card-panel white'><div class='container'><div class='row'><div class='input-field col s12'> ${name} <br> ${urls[name].url} </div></div></div></div>`;     
  })
)