Question

我有一个数组。

＆＃13;

var citycode = [
  ["In Milan", 0],
  ["Rom", 5],
  ["Modena", 6],
  ["Others", 20]
];

＆＃13;

如何从For循环中为此数组返回值：

<div class="loop"><span>In Milan</span><span>0</span> </div>
<div class="loop"><span>Rom</span><span>5</span> </div>
....

非常感谢。

Answer 1

使用函数式编程，无需循环。

var cityCode = [
  ["In Milan", 0],
  ["Rom", 5],
  ["Modena", 6],
  ["Others", 20]
];

const result = cityCode.map(code => 
  `<div class="loop"><span>${code[0]}</span><span>${code[1]}</span></div>`
).join('')

document.body.innerHTML = result;
console.log(result);

Answer 2

＆＃13;

var citycode = [
  ["In Milan", 0],
  ["Rom", 5],
  ["Modena", 6],
  ["Others", 20]
];



for (var i = 0; i < citycode.length; i++) {
  for (var o = 0; o < citycode[i].length; o++) {

    console.log(citycode[i][o])

  }


}

＆＃13;

使用2 for循环来获取每个项目

Answer 3

您可以创建DOM元素并附加body。

var citycode = [["In Milan", 0], ["Rom", 5], ["Modena", 6], ["Others", 20]];

citycode.forEach(function (city) {
    var div = document.createElement('div');

    city.forEach(function (a) {
        var span = document.createElement('span');
        span.appendChild(document.createTextNode(a));
        this.appendChild(span);
    }, div);

    this.appendChild(div);
}, document.body);

Answer 4

不要迂腐，但OP要求循环..

    var htmlContent = "";
            for (var i = 0; citycode.length > i; i++) {
              htmlContent += '<div class="loop"><span>' + citycode[i][0] + '</span><span>' + citycode[i][1] + '</span></div>'
    }

Answer 5

我认为@python %~dp0..\tools\scripts\2to3.py %*非常适合这些工作。您可以按照以下方式执行功能;

基本上你不应该在DOM上工作，而是在文档片段上工作，一旦完成你的工作，就可以将文档片段一次性地附加到DOM的正确位置。

＆＃13;

2to3 test.py

＆＃13;

Array.prototype.reduce()

＆＃13;

var citycode = [["In Milan ", 0], ["Rom ", 5], ["Modena ", 6], ["Others ", 20]],
    mainDiv = document.getElementById("main");
mainDiv.appendChild(citycode.reduce(function(p,c){
                                      var d = document.createElement("div");
                                      d.classList.add("loop");
                                      c.reduce(function(dv,sp){
                                                 var s = document.createElement("span");
                                                 s.textContent = sp;
                                                 dv.appendChild(s);
                                                 return dv;
                                               },d);
                                      p.appendChild(d);
                                      return p;
                                    },document.createDocumentFragment()));

＆＃13;

来自＆＃34;循环＆＃34;的返回值对于二维数组

5 个答案: