<html>
<head>
<style type="text/css">
table, th, td {
position: relative;
border: 1px solid black;
width: 40%;
height:40px;
top: 5%;
}
</style>
<script type="text/javascript">
function lab()
{
var x= document.getElementById('lab').value;
var rows="";
rows+= "<tr><td>"+x+"</td></tr>";
}
function inp()
{
var y= document.getElementById('inp1').value;
}
</script>
</head>
<body>
<button id="lab" onclick="lab()" value="label">Label</button>
<button id="inp1" onclick="inp()" value="Input">Input</button>
<button id="res" onclick="reset()">reset</button>
</body>
<table id="me1">
<tr>
<td></td>
<td></td>
</tr>
<tbody></tbody>
</table>
</html>
我试图通过单击按钮在表格的列中添加文本。
所以请帮我添加表格列中按钮上写的文本
谢谢
最佳答案
我不完全理解您的要求，但您可以使用innerHTML删除较早的内容并插入新内容。或者使用 appendChild 和 createElement 随时随地创建和插入新元素。该示例通过每个按钮演示了两者。
function lab() {
var x = document.getElementById('lab').value;
var rows = "";
rows += "<tbody><tr><td>" + x + "</td></tr></tbody>";
document.getElementById('me1').innerHTML = rows;
}
function inp() {
var table = document.getElementById('me1');
var tbody = table.getElementsByTagName('tbody')[0];
var y = document.getElementById('inp1').value;
var text = document.createTextNode(y);
var col = document.createElement('td');
var row = document.createElement('tr');
col.appendChild(text);
row.appendChild(col);
tbody.appendChild(row);
}table,
th,
td {
position: relative;
border: 1px solid black;
width: 40%;
height: 40px;
top: 5%;
}<button id="lab" onclick="lab()" value="label">Label</button>
<button id="inp1" onclick="inp()" value="Input">Input</button>
<button id="res" onclick="reset()">reset</button>
</body>
<table id="me1">
<tr>
<td></td>
<td></td>
</tr>
<tbody></tbody>
</table>关于javascript - 如何使用 Javascript 单击按钮将数据添加到表中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40162143/