UC知道JavaScript小问题
来源：百度知道 编辑：UC知道 时间：2024/06/19 05:07:39
<html>
<script>
var i = 1;
function insert_row(){
var R = document.getElementById("tableContent").insertRow();
var C = R.insertCell();
C.innerHTML = "<tr><td id='td" + i + "'>" + i + "</td><td><input type='checkbox' onclick='doCheck()'></td></tr>";
i++;
}
function doCheck(){
alert(document.getElementById('tableContent').children.length); //问题1:为什么行数总是1
alert(document.getElementById("td" + i)); //问题2:为什么得不到单元格对象
}
</script>
<body>
<input type="button" id="buttonInsert" name="buttonInsert" value="插入一行" onclick="insert_row()"></input>
<table id="tableContent"></table>
</body>
</html>
<script>
var i = 1;
function insert_row(){
var R = document.getElementById("tableContent").insertRow();
var C = R.insertCell();
C.innerHTML = "<tr><td id='td" + i + "'>" + i + "</td><td><input type='checkbox' onclick='doCheck()'></td></tr>";
i++;
}
function doCheck(){
alert(document.getElementById('tableContent').children.length); //问题1:为什么行数总是1
alert(document.getElementById("td" + i)); //问题2:为什么得不到单元格对象
}
</script>
<body>
<input type="button" id="buttonInsert" name="buttonInsert" value="插入一行" onclick="insert_row()"></input>
<table id="tableContent"></table>
</body>
</html>
//问题1:为什么行数总是1
因为实际上生成的html结构如下
<table>
<tbody>
<tr><td></td></tr>
</tbody>
</table>
所以document.getElementById('tableContent').children取得的对象为tbody
你可以尝试alert(document.getElementById('tableContent').innerHTML);
//问题2:为什么得不到单元格对象
因为i是全局变量，每次i都是最大的哪个。比如你增加啦 3行，则i值变为4.td4这个单元格是不存在的。