使用DOM-JavaScript组织表中的元素

使用DOM-JavaScript组织表中的元素,javascript,dom,Javascript,Dom,此代码用于创建一个表 var table = document.createElement("table"); if ((lines > 0) && (columns> 0)) { var tbody = document.createElement("tbody"); var tr, td; for (var i = 0; i < lines; i++) { tr = document.createElement("tr")

此代码用于创建一个表

var table = document.createElement("table");
if ((lines > 0) && (columns> 0)) {
    var tbody = document.createElement("tbody");
    var tr, td;
    for (var i = 0; i < lines; i++) {
      tr = document.createElement("tr");
      for (var j = 0; j < columns; j++) {
        td = document.createElement("td");
        tr.appendChild(td);
      }
      tbody.appendChild(tr);
    }
    table.appendChild(tbody);
    document.body.appendChild(table);
我想要像这张图2一样

如果我做了,我可以做

//panel with 4 lines and 4 columns to 16 equipments
(new Panel("panel",4,4))
.putAndShowEquipment (0, 0, new Equipament())
.putAndShowEquipment (0, 1, new Equipament())
.putAndShowEquipment (1, 0, new Equipament())
.putAndShowEquipment (1, 1, new Equipament())
.putAndShowEquipment (2, 0, new Equipament())
.putAndShowEquipment (2, 1, new Equipament())
 ...
 ;
但是我试着用
for
创建
行和
并放置装备,我想可能在四列时有限制,换到另一行,我已经准备好了,现在只是一个计算问题

//four lines
for (var i = 0; i < lines; i++) {
 //four columns
  for (var j = 0; j < columns; j++) {
    //if column is four
    if (j === 4) {
      //change line
     //this.equipaments.lenght = 16 equipments
      panel.putAndShowEquipment(i + 1, j, this.equipaments[i]);
    } else {
      panel.putAndShowEquipment(i, j, this.equipaments[i]);
    }
  }
}
//四行
对于(变量i=0;i

有什么建议吗?

鉴于您更新的问题,您似乎只需要将平面数组的每个成员传递给构造函数,从而将平面数组转换为矩形数组

如果是这种情况,并且假定
行*列的数量
将等于
this.equipments.length
,那么您所需要的不是
If
语句,而是从
i
j
计算索引

// lines * columns === this.equipaments.length

for (var i = 0; i < lines; i++) {
  for (var j = 0; j < columns; j++) {
    panel.putAndShowEquipment(i + 1, j, this.equipaments[(i * columns) + j]);
  }
}
//行*列===this.equipments.length
对于(变量i=0;i

因为每行的列数相等,所以我们将当前行号乘以总列数,然后再加上当前列数。

有点难理解,但是如果有4列,那么
j
在循环内将永远不会等于
4
,因为循环将停止。不确定为什么需要
if
语句,但是我们不知道上一个代码块中的
this
的值是多少。似乎它应该是
面板.putAndShowEquipment(i,j,/*?*/)
,但是没有足够的信息来知道第三个参数应该从哪里来。另外,在
putAndShowEquipment
方法中,似乎
(line
应该是
(line
,但同样,没有足够的信息。@squint,谢谢,我看到了错误,我编辑了
(line
,设备来自
this.devices=[]
类面板中,我没有放置另一个,因为我认为不是neccessary@squint,我编辑了问题,添加了我需要实现的更多代码,以获得按插入顺序在表中插入设备的计算,如图2所示,我使用
line*columns==this.equipments.length
不起作用,我使用
var line=this.equipments.length
var columns=this.devices.length
工作,但相同的
面板
显示剩余的
为空,无论如何,仅显示填充了的行和列equipments@RenataPSouza:
lines*columns===this.equipments.length
在注释中只是为了说明
行数
乘以
列数
应该等于数组的
.length
。把它拿走。为什么将
设置为数组的相同长度?若你们有
这个.equipments.length
项目要放进去,那个么
行和
列应该是
.length
的因素。
// lines * columns === this.equipaments.length

for (var i = 0; i < lines; i++) {
  for (var j = 0; j < columns; j++) {
    panel.putAndShowEquipment(i + 1, j, this.equipaments[(i * columns) + j]);
  }
}