添加按钮到动态html表javascript

时间:2014-07-25 23:31:04

标签: javascript html

我是动态javascript的新手,我在动态HTML表格中添加了一个按钮。

function addToTable(){

    var table = document.getElementById("table");
    var row = table.insertRow(counter + 1);

    var removeRow=document.createElement("BUTTON");

    var cell0 = row.insertCell(0)
    var cell1 = row.insertCell(1);
    var cell2 = row.insertCell(2);
    var cell3 = row.insertCell(3);

    cell0.innerHTML = counter + 1;
    cell1.innerHTML = getName(array[counter]); 
    cell2.innerHTML = getEmail(array[counter]);
    cell3.innerHTML = document.body.appendChild(removeRow);

    counter++;
}

每当我运行它时,在第一个单元格中我会得到索引号,名称和电子邮件。在第四个单元格中打印" [object HTMLButtonElement]"。

另外一个问题是当我在按钮上分配标签时,整个方法都不起作用。这就是我添加标签的方式。

var removeRow=document.createElement("BUTTON");
var text=document.createTextNode("Remove");
btn.appendChild(text);
document.body.appendChild(removeRow);

1 个答案:

答案 0 :(得分:1)

您不应该将单元格的innerHTML设置为document.appendChild的返回值,这将返回一个DOM对象,该对象在设置为HTML时会变为字符串。您只需将按钮附加到单元格即可。

cell3.appendChild( removeRow );

fiddle

注意:正如我在小提琴中所做的那样,你应该设置创建按钮的innerHTML。