javascript: TypeError: document.getElementById("myTable") 为空
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12471249/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
javascript: TypeError: document.getElementById("myTable") is null
提问by vaanipala
i'm getting the following error:
我收到以下错误：
TypeError: document.getElementById("myTable") is null
on document.write(document.getElementById("myTable").rows[i].innerHTML); It goes into a never ending loop.
在 document.write(document.getElementById("myTable").rows[i].innerHTML); 它进入一个永无止境的循环。
Can someone tell me on what i'm doing wrong? Thank you.
有人可以告诉我我做错了什么吗？谢谢你。
My code:
我的代码：
<script type="text/javascript">
function colorRows(){
count=document.getElementById("myTable").rows.length;
alert("count is:"+count);
for (i=0;i<=count;i++){
if (i%2===0){
document.write(document.getElementById("myTable").rows[i].innerHTML);
}
}
}
</script>
</head>
<body>
<table id="myTable">
<tr>
<th>emp_id</th>
<th>name</th>
<th>age</th>
</tr>
<tr>
<td>1</td>
<td>vaani</td>
<td>35</td>
</tr>
<tr>
<td>2</td>
<td>Ramu</td>
<td>37</td>
</tr>
<tr>
<td>3</td>
<td>Iniyan</td>
<td>5</td>
</tr>
<tr>
<td>4</td>
<td>Mickey</td>
<td>10</td>
</tr>
</table>
<form method="post" action="JavaScript:colorRows();">
<input type="submit" value="Submit" />
</form>
</body>
</html>
回答by Danil Speransky
It is because when you do document.writein the loop in the first time you clear dom and there is no more table element, and when you do document.writein the second time then document.getElementById("myTable")provides null. So browser stops the script provide the error.
这是因为当你document.write第一次在循环中执行时，你清除了 dom 并且没有更多的表元素，而当你document.write在第二次执行时document.getElementById("myTable")提供null. 所以浏览器停止脚本提供错误。
回答by swemon
I have the same error when I run your code. I put myTable to a new variable outside of for. It works fine. like that.
当我运行您的代码时，我遇到了同样的错误。我将 myTable 放在 for 之外的一个新变量中。它工作正常。像那样。
var myTableVar = document.getElementById("myTable");
var i;
for (i=0;i<=count;i++){
alert("i = " + i);
if (i%2===0){
document.write(myTableVar.rows[i].innerHTML);
}
}
Complete code:
完整代码：
<html>
<head>
<script type="text/javascript">
function colorRows(){
count=document.getElementById("myTable").rows.length;
alert("count is:" + count);
var myTableVar = document.getElementById("myTable");
var i;
for (i=0;i<=count;i++){
alert("i = " + i);
if (i%2===0){
document.write(myTableVar.rows[i].innerHTML);
}
}
}
</script>
</head>
<body>
<table id="myTable">
<tr>
<th>emp_id</th>
<th>name</th>
<th>age</th>
</tr>
<tr>
<td>1</td>
<td>vaani</td>
<td>35</td>
</tr>
<tr>
<td>2</td>
<td>Ramu</td>
<td>37</td>
</tr>
<tr>
<td>3</td>
<td>Iniyan</td>
<td>5</td>
</tr>
<tr>
<td>4</td>
<td>Mickey</td>
<td>10</td>
</tr>
</table>
<form method="post" action="JavaScript:colorRows();">
<input type="submit" value="Submit" />
</form>
</body>
</html>
回答by lukek
Try this
试试这个
function colorRows(){
var table = document.getElementById("myTable");
count=table.rows.length;
alert("count is:"+count);
for (i=0;i<=count;i++){
if (i%2===0){
document.write(table.rows[i].innerHTML);
}
}
}
Best to only access the table once anyway. document.write() clears the page because it calls document.open()
无论如何最好只访问表一次。document.write() 清除页面，因为它调用 document.open()
