<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
window.onload = function () {
var Btns = document.getElementsByTagName("button");
for (i = 0; i < Btns.length; i++) {
//为什么把这个放在里面就是未定义??
Btns[i].onclick = function () {
alert(this);
}
}
}
</script>
</head>
<body>
<button>按钮1</button>
<button>按钮2</button>
<button>按钮3</button>
</body>
</html>
i代表的是这三个按钮的下标,那
Btns[i].onclick = function () {
alert(this);
}
中的i就分别代表了按钮1、2、3,那我在alert(this)的时候就应该分别对应这三个按钮但是为什么只有我当只用下面代码的时候才正确?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
window.onload = function () {
var Btns = document.getElementsByTagName("button");
for (i = 0; i < Btns.length; i++) {
Btns[i].index = i;
//为什么把这个放在里面就是未定义??
Btns[i].onclick = function () {
alert(this.index);
}
}
}
</script>
</head>
<body>
<button>按钮1</button>
<button>按钮2</button>
<button>按钮3</button>
</body>
</html>
问题2:在上面的这段代码中为什么Btns[i].index = i;这个代码不能放在
Btns[i].onclick = function () {
alert(this.index);
}
这段代码中,而必须放在外面才行?