for(var i=0;i<10;i++){ var button=document.createElement("button"); button.innerText=i+1; button.onclick=function(){ alert(i); } document.body.appendChild(button); }
结果是10个button,点击每一个都会弹出10。
const定义的是常量;
var与let定义的是变量;
var是函数作用域,let是块作用域;
let不能重复声明覆盖,var可以重复声明覆盖;
也就是说在for循环里var出来的i,每次都被覆盖了新的值,所以当onclick时alert出的i是最终循环结束的值i=10。
如果改用let定义
for(let i=0;i<10;i++){ var button=document.createElement("button"); button.innerText=i+1; button.onclick=function(){ alert(i+1); } document.body.appendChild(button); }
这里10个button就会分别弹出1-10。
因为var是不断覆盖i,给它新的值,而let不会覆盖。