Question

Html文件：

<body>
<table id="tblUser"></table>
</body>

Javascript：

var userName="Tom";
var age= "21";
//now to put these data into a table

现在，如何将Javascript中的数据放入表中，使其看起来像这样

Name - Age
Tom    21

Answer 1

您应该使用 createElement() 和 appendChild() ，请查看以下示例。

希望这有帮助。

var table = document.getElementById('tblUser');
var userName="Tom";
var age= "21";

var tr = document.createElement('tr');   

var td_1 = document.createElement('td');
var td_2 = document.createElement('td');

var text_1 = document.createTextNode('Name');
var text_2 = document.createTextNode('Age');

td_1.appendChild(text_1);
td_2.appendChild(text_2);
tr.appendChild(td_1);
tr.appendChild(td_2);

table.appendChild(tr);

var tr_2 = document.createElement('tr');   

var td_3 = document.createElement('td');
var td_4 = document.createElement('td');

var text_3 = document.createTextNode(userName);
var text_4 = document.createTextNode(age);

td_3.appendChild(text_3);
td_4.appendChild(text_4);
tr_2.appendChild(td_3);
tr_2.appendChild(td_4);

table.appendChild(tr_2);

document.body.appendChild(table);

<table id="tblUser" border=1></table>

如何使用javascript将数据放入HTML表格

1 个答案: