<!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);
}
这段代码中，而必须放在外面才行？
因为作用域不同呀，一个是在onclick的funtion了，这时候的this指向的是button，二你后面的this.index指的还是button，但是因为你给button加了一个属性index赋值=i，这时候你活得this.index 就等于i了，如果你要输出i 那你就直接alert(i)就好了
你这个写法。。。。有点奇怪
首先 你是要做什么 如果是要给三个按钮分别 对应一个值的话 我建议这样写
<button onclick="test(1)">按钮1</button>
<button onclick="test(2)">按钮2</button>
<script>
function test(i){
alert(i);
}
</script>作用域的问题，用let定义一下就好了
<!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");
console.log('djkfjdk',Btns.length)
for (let i = 0; i < Btns.length; i++) {
console.log('这是',i)
//为什么把这个放在里面就是未定义？？
Btns[i].onclick = function () {
alert(i);
}
}
}
</script>
</head>
<body>
<button>按钮1</button>
<button>按钮2</button>
<button>按钮3</button>
</body>
</html>