使用foreach时重复表id

时间:2014-05-12 11:07:25

标签: javascript html

我的疑惑令人困惑。我会尽可能简单地分解它。 在HTML页面中,我在forEach循环中有一个表。因此会出现多个表。但是所有表都有相同的标题,但其余值都不同。所以我需要在JavaScript中设置表头以减少HTML代码。

function myFunction()
{
   var table = document.getElementById("myTable");
   var header = table.createTHead();
   var row = header.insertRow(0);
   var cell = row.insertCell(0);
   cell.innerHTML = "<b>Resource Name</b>";
}

这是我用过的代码。但是id不再重复了。因此表头仅用于第一个表。 id的任何解决方案或替代方案?

1 个答案:

答案 0 :(得分:1)

var tables = document.getElementsByTagName("table");
var len = tables.length, i=0, header, row, cell;
for(;i<len;i++){
   header = tables[i].createTHead();
   row = header.insertRow(0);
   cell = row.insertCell(0);
   cell.innerHTML = "<b>Resource Name</b>";
}

http://fiddle.jshell.net/4AmmP/1/

修改 (使用class

class添加到您想要受影响的表格(例如class="myTableClass")并使用以下编辑的代码

var tables = document.getElementsByTagName("table");
var len = tables.length, i=0, header, row, cell;
for(;i<len;i++){
  /* Check if the table has the class "myTable" */
  if(tables[i].className === "myTable") {
     header = tables[i].createTHead();
     row = header.insertRow(0);
     cell = row.insertCell(0);
     cell.innerHTML = "<b>Resource Name</b>";
  }
}

http://fiddle.jshell.net/4AmmP/2/