本人js初学，也想写一些博客记录我的js学习之路。 今天在写一个简单的事件绑定的时候发现将this换成调用对象的时候发生错误。 代码如下：
<!DOCTYPE html>
<html>
<head>
<title>AAA</title>
<meta charset="UTF-8">
</head>
<body>
<p>AAAA</p>
<p>BBBB</p>
<script type="application/javascript">
var ps = document.getElementsByTagName("p");
for (var i = 0; i < ps.length; i++) {
ps[i].onclick = function () {
ps[i].style.color = "red";
}
}
</script>
</body>
</html>
这段代码中，将onclick事件绑定的函数中this换成了调用者ps[i]。执行代码，报错Uncaught TypeError: Cannot read property ‘style’ of undefined. 原因是：执行这段代码时，js首先会执行完整个循环，将函数绑定到相应的对象中，用户点击触发事件时，实际上变量i已经变为了2，ps[2]不存在，所以报错。for循环内用var定义的变量i是全局变量。
解决方法，可以使用ES6的新特性 let去定义变量i , 这样就不会报错了。
转载请注明原文地址: https://ju.6miu.com/read-1140.html
