为什么在给html结点添加元素时总是出现下面的提示错误：
UncaughtTypeError:Cannotreadproperty'appendChild'ofnull？...
Uncaught TypeError: Cannot read property 'appendChild' of null ？
展开
2个回答
展开全部
这个一般是你获取的节点不存在引起的。
可能出现这种情况的原因：你获取这节点时，节点还没加载，例如：你的JS写在head里面，取body里面的某一节点，这时候是取不到的。这种情况的解决方法：把JS代码放到</body>后面。
如果是其它原因，要以发代码出来看看。
可能出现这种情况的原因：你获取这节点时，节点还没加载，例如：你的JS写在head里面，取body里面的某一节点，这时候是取不到的。这种情况的解决方法：把JS代码放到</body>后面。
如果是其它原因，要以发代码出来看看。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
我也遇到了这样的问题，为此我真的弄了一个下午。那时候我都快崩溃了，我把我遇到的问题发出来，希望可以帮到更多的人
首先 这是我的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<script>
var divname123 = document.getElementById("divname");
var order = false;
function Student(name, number) {
this.name = name;
this.number = number;
}
var students = new Array(new Student('郑文达', 3), new Student('曾浩', 2), new Student('炳飞', 1), new Student('泽龙', 4));
var names = "";
for(index in students) {
names += students[index].name + " , ";
}
tn = document.createTextNode(names);
tn.nodeValue = names;
divname123.appendChild(tn);
</script>
<body>
<div id="divname">aa</div><br />
<input type="button" value="升序" />
<input type="button" value="降序" />
</body>
</html>
运行的时候出现这样的问题：Uncaught TypeError: Cannot read property 'appendChild' of null。
这是因为divname123没有被获取到的缘故。所以我帮script之间的代码放到</body>后面去，问题就解决了。
<body>
<div id="divname">aa</div><br />
<input type="button" value="升序" />
<input type="button" value="降序" />
</body>
<script>
var divname123 = document.getElementById("divname");
var order = false;
function Student(name, number) {
this.name = name;
this.number = number;
}
var students = new Array(new Student('郑文达', 3), new Student('曾浩', 2), new Student('炳飞', 1), new Student('泽龙', 4));
var names = "";
for(index in students) {
names += students[index].name + " , ";
}
tn = document.createTextNode(names);
tn.nodeValue = names;
divname123.appendChild(tn);
}
</script>
具体原因我还真的不清楚。
而且使用链接方式的也可以，不过链接要写在</body>的后面。具体代码在下面。
<body>
<div id="divname">aa</div><br />
<input type="button" value="升序" />
<input type="button" value="降序" />
</body>
<script type="text/javascript" src="js/new_file2.js"></script>
在我看来，可能是因为我们的html文件是从头开始向尾部解析的，所以当解析到var divname123 = document.getElementById("divname");，由于还没有解析到后面的内容，所以系统误以为没有定义ID为"divname"的容器（我是这样认为的，希望懂的小伙伴可以告诉我正确的答案哦），而其他例如textarea，input ，这样的组件就不会遇到的这样的问题，所以我就很纳闷为什么DIV容器会遇到这样的问题。
希望可以帮助到各位。
首先 这是我的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<script>
var divname123 = document.getElementById("divname");
var order = false;
function Student(name, number) {
this.name = name;
this.number = number;
}
var students = new Array(new Student('郑文达', 3), new Student('曾浩', 2), new Student('炳飞', 1), new Student('泽龙', 4));
var names = "";
for(index in students) {
names += students[index].name + " , ";
}
tn = document.createTextNode(names);
tn.nodeValue = names;
divname123.appendChild(tn);
</script>
<body>
<div id="divname">aa</div><br />
<input type="button" value="升序" />
<input type="button" value="降序" />
</body>
</html>
运行的时候出现这样的问题：Uncaught TypeError: Cannot read property 'appendChild' of null。
这是因为divname123没有被获取到的缘故。所以我帮script之间的代码放到</body>后面去，问题就解决了。
<body>
<div id="divname">aa</div><br />
<input type="button" value="升序" />
<input type="button" value="降序" />
</body>
<script>
var divname123 = document.getElementById("divname");
var order = false;
function Student(name, number) {
this.name = name;
this.number = number;
}
var students = new Array(new Student('郑文达', 3), new Student('曾浩', 2), new Student('炳飞', 1), new Student('泽龙', 4));
var names = "";
for(index in students) {
names += students[index].name + " , ";
}
tn = document.createTextNode(names);
tn.nodeValue = names;
divname123.appendChild(tn);
}
</script>
具体原因我还真的不清楚。
而且使用链接方式的也可以，不过链接要写在</body>的后面。具体代码在下面。
<body>
<div id="divname">aa</div><br />
<input type="button" value="升序" />
<input type="button" value="降序" />
</body>
<script type="text/javascript" src="js/new_file2.js"></script>
在我看来，可能是因为我们的html文件是从头开始向尾部解析的，所以当解析到var divname123 = document.getElementById("divname");，由于还没有解析到后面的内容，所以系统误以为没有定义ID为"divname"的容器（我是这样认为的，希望懂的小伙伴可以告诉我正确的答案哦），而其他例如textarea，input ，这样的组件就不会遇到的这样的问题，所以我就很纳闷为什么DIV容器会遇到这样的问题。
希望可以帮助到各位。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
