Question

我正在动态创建一个表，当我插入标题时，缺少结果之一。应该是：

| header 1 | header 2 |
| data | data |
| data | data |

但显示为：

| header 1 | header 2 |
| data | data |

如果我删除了thead部分，那么一切都会正确显示。

部分代码。

    for (var i = gymLinks.length - 1; i >= 0; i--) {
      //capture URL
      var url = gymLinks[i].substr(0, 106);
      //capture app version
      var appVersion = gymLinks[i].substr(108, 111);
      //Creating the table
      var table = document.getElementById("myTable");
      //create table header 
      var theader = table.createTHead (0);
      theader.innerHTML = '<tr><th>Gym Link</th><th>Version</th></tr>';              
      var row = table.insertRow(1);
      var cell1 = row.insertCell(0);
      var cell2 = row.insertCell(1);
      //creating table elements
      linkElement = document.createElement("a");
      linkElement.setAttribute("href", url);
      var linkText = document.createTextNode(url);
      //linkElement.append(linkText);
      cell1.innerHTML = '<a href="' + url + '">' + linkElement + "</a>";
      cell2.innerHTML = appVersion;
    }
  });

Answer 1

这可能是因为您只是将行插入到同一行索引中。

var row = table.insertRow(1);

Answer 2

这可能对您有帮助吗？

机会

for (var i = gymLinks.length - 1; i >= 0; i--)

到

for (var i = 0 ; i <= gymLinks.length - 1; i++)

然后尝试...

  var row = table.insertRow(i); or i+1??

Answer 3

感谢Amy和frobinsonj提出的建议。

我将此移到了循环之外

    var theader = table.createTHead (0);
    theader.innerHTML = '<tr><th>Gym Link</th><th>Version</th></tr>';

已更新：

      var row = table.insertRow(1);

Javascript thead DOM覆盖第一行数据

3 个答案: