js中Uncaught TypeError: Cannot set property ‘***‘ of null问题解决方法

最新推荐文章于 2023-12-06 10:19:51 发布

Fantasc

最新推荐文章于 2023-12-06 10:19:51 发布

阅读量1.1k

点赞数

分类专栏：已解决问题文章标签： javascript

本文链接：https://blog.csdn.net/Fantasc/article/details/119296758

版权

已解决问题专栏收录该内容

4 篇文章 0 订阅

订阅专栏

要求：点击id为btn7按钮来获取id为bj的父节点

在如下代码中，定义了一个函数来为指定的按钮绑定单击事件，idStr为对应按钮id的值，fun为回调函数，是按钮的功能代码。

这里会报错，错误提示为：
dom查询（2）.html:20 Uncaught TypeError: Cannot set property ‘onclick’ of null
at myClick (dom查询（2）.html:12)
at window.onload (dom查询（2）.html:16)

**注意：**在此代码中，以上错误的问题不在于myClic()函数没有写在window.onload(){…}之内，而在于调用myClick()函数时传递的实参，如下：

myClick(btn7,function(){
var bj = document.getElementById(“bj”);
console.log(bj.parentNode);
});

第一个实参传递的是对应按钮id值，是字符串，要用引号引起来，而这里直接传递的是一个变量，将btn7用引号引起来即可解决。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="css/dom.css" />
    <title>Document</title>
	<script type="text/javascript">
		function myClick(idStr,fun){
	            var btn = document.getElementById(idStr);
	            btn.onclick = fun;
	        }
	        
	     window.onload = function(){
				 myClick(btn7,function(){
				 //正确代码为：myClick("btn7",function(){
	                var bj = document.getElementById("bj");
	                console.log(bj.parentNode);
	            });
	     };
	</script>
	
<body>
	<button id = "btn7">获取id为bj元素的节点</button>
	<div class="one">  
           <ul id="city">
               <li id="bj">北京</li>
               <li id="shanghai">上海</li>
               <li id="dongjing">东京</li>
               <li id="shouer">首尔</li>
           </ul>
	 </div>
</body>
</html>