JavaScript：Uncaught TypeError Cannot read property 'id' of null。

最新推荐文章于 2024-02-11 18:18:33 发布

A_山水子农

最新推荐文章于 2024-02-11 18:18:33 发布

阅读量3.8w

点赞数 2

分类专栏： JavaScript 文章标签： dom javascript Uncaught TypeError C

本文链接：https://blog.csdn.net/qq_27626333/article/details/51576560

版权

JavaScript 专栏收录该内容

55 篇文章 2 订阅

订阅专栏

用JavaScript操作DOM时出现如下错误：

Uncaught TypeError Cannot read property 'id' of null。

Uncaught TypeError: Cannot read property 'className' of null。

例如：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="javascript" src="jquery.js"></script>
<script>
var div=document.getElementById("divTest");
alert(div.id);
alert(div.className);
alert(div.title);
</script>
<style>
#divTest{
margin-top:30px;
margin-bottom:40px;
}
span{
border-color:#3C0;
border-style:solid;
margin-bottom:5px;
padding:10px 30px 10px 30px;
border-radius:10px
}
</style>
<title>无标题文档</title>
</head>
<body>
<div id="divTest" class="bd" title="body">
     <span>0</span> <span>1</span> <span>2</span> <span>3</span>
</div>
</body>
</html>

运行时出现如下错误：

问题出在JS运行的时候你的页面还没有加载完成，所以你的JS代码找不到你的页面元素，就会抛出这个问题。解决办法就是把JavaScript代码放在body的最后，例如：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
#divTest{
margin-top:30px;
margin-bottom:40px;
}
span{
border-color:#3C0;
border-style:solid;
margin-bottom:5px;
padding:10px 30px 10px 30px;
border-radius:10px
}
</style>
<title>无标题文档</title>
</head>
<body>
<div id="divTest" class="bd" title="body">
     <span>0</span> <span>1</span> <span>2</span> <span>3</span>
</div>
<script language="javascript" src="jquery.js"></script>
<script>
var div=document.getElementById("divTest");
alert(div.id);
alert(div.className);
alert(div.title);
</script>
</body>
</html>

A_山水子农

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
2
评论
JavaScript：Uncaught TypeError Cannot read property 'id' of null。

用JavaScript操作DOM时出现如下错误：Uncaught TypeError Cannot read property 'id' of null。Uncaught TypeError: Cannot read property 'className' of null。例如：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...
复制链接

扫一扫