html引入let,let与ver作用域

## var和let

~~~

Document

.one{

color: red;

}

• 1
• 1
• 1

var lis = document.getElementsByTagName("li");

/* var作用域有问题，所以用var定义变量时变量名要不一样 */

// for(var i = 0;i

// lis[i].onclick = function (){

/* 每点击一下就先执行一遍for将所选项颜色全覆盖为black，

然后执行当前点击项，将当前项颜色变为red */

// for(var k = 0;k

// lis[k].style.color = "black";

// console.log(k);

// }

// this.style.color = "red";

// }

// }

/* let作用域为快，只在当前for{}中，所以可以不用this，for中变量可以一致不会影响结果*/

for(let i = 0;i

lis[i].onclick = function (){

for(let i = 0;i

lis[i].style.color = "black";

console.log(i);

}

lis[i].style.color = "red";

}

}

/* 这种方式不能实现只有当前点击项颜色为red，其它颜色不变 */

// for(var i = 0;i

// lis[i].style.color = "black";

// console.log(i);

// lis[i].onclick = function (){

// this.style.color = "red";

// }

// }

for(let c = 1; c<10;c++){

let d = 24;

}

console.log(a);//可以引用外部var定义的变量

console.log(b);//可以引用外部let定义的变量

console.log(c); //报错 for(let定义的变量不可引用)

console.log(d); //报错for(){let定义的变量不可引用}

~~~