在动态添加的行中添加计数器到ID名称

Question

这是添加行的函数的一部分。它的作用就像一个魅力，除了我还希望它为每个新创建的元素集的ID名称添加一个整数（+1）。

例如，下面的代码会生成一行，一个单元格和一个按钮。如果创建了三行，那么我希望每行的按钮ID分别为foo1，foo2，foo3。

我该如何去做到这一点？

function addrow() { 
var i = 1; 
var table = document.getElementById("mytable"); 
var row = table.insertRow(1); 
var cell1 = row.insertCell(1); 
cell1.innerHTML = "<input type='button' id='foo+i' value='Hello'>"; 
i++;} 

预先感谢您！

Answer 1

变化：

cell1.innerHTML = "<input type='button' id='foo+i' value='Hello'>"; 

到：

cell1.innerHTML = "<input type='button' id='foo" + i + "' value='Hello'>"; 

Answer 2

你需要与你的递增变量Concat的字符串，而不是把它里面的字符串。

"<input type='button' id=foo" + i +" value='Hello'>" 

但是，还有更多你需要做的...... 你需要让你的i变量是全球性的，因此不会被重置每次调用这个函数像这样

var i = 1; 
function addrow() { 
    var table = document.getElementById("mytable"), 
     row = table.insertRow(i), 
     cell1 = row.insertCell(i); 
    cell1.innerHTML = '<input type="button" id=foo' + i + ' value="Hello">'; 
    i++; 
} 

我周围也改变了引号，因为单引号不被认为是对HTML

有效语法

Answer 3

变化

cell1.innerHTML = "<input type='button' id='foo+i' value='Hello'>"; 

到

cell1.innerHTML = "<input type='button' id='foo"+ i +"' value='Hello'>"; 

和初始化i值作为全局变量。

使用

var i = 1; 
function addrow() { 
    var table = document.getElementById("mytable"); 
    var row = table.insertRow(1); 
    var cell1 = row.insertCell(1); 
    cell1.innerHTML = "<input type='button' id='foo"+i +"' value='Hello'>"; 
    i++; 
}