<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
var teacher = {
name:"Petter",
age:30
}
window.onload = function()
{
var student = {
name:"Tom",
age:18
}
}
</script>
</body>
</html>
以上代码，在浏览器中运行，然后 F12 打开调试，在控制台输入 teacher 时，可以正常访问该变量，而当输入 student 时，将报错：
报错的原因如下：
window.onload 表示页面加载完成：
1）DOM 元素加载完成：可以访问到页面中多有的DOM
2）页面中引用的资源文件也已经加载完成：图片、CSS、JS、MP4......
而页面加载是否完成，跟一个变量访问没有任何关系。一个变量是否可以被访问看的是它的作用域，以上代码中变量 teacher 是全局变量，所以在控制台可以正常访问，而变量 student 是在函数中定义的，是一个局部变量，因此只能在声明该变量的函数中访问。
网友评论