Mic*_*695 -1 javascript ecmascript-6
以下是我的HTML页面:
<html>
<head>
<script type="text/javascript" src="/game/js/ready/main.js" ></script>
<link rel="stylesheet" type="text/css" href="/game/css/nav.css" />
</head>
<body>
<div class="nav-buttons">
<span class="nav-button" onclick="f()">Show A</span>
<span class="nav-button" onclick="h()">Show B</span>
<span class="nav-button" onclick="g()">Show C</span>
</div>
<div id="divA">
a
</div>
<div id="divB">
b
</div>
<div id="divC">
c
</div>
</body>
</html>
以下是我的main.js文件:
var divA = document.getElementById("divA");
var divB = document.getElementById("divB");
var divC = document.getElementById("divC");
function f(){
window.divA.style.display = "block";
window.divB.style.display = "none";
window.divC.style.display = "none";
}
function h(){
window.divA.style.display = "none";
window.divB.style.display = "block";
window.divC.style.display = "none";
}
function g(){
window.divA.style.display = "none";
window.divB.style.display = "none";
window.divC.style.display = "block";
}
据我所知,这是有效的.但是,当我调用时f(),我收到一个错误,指出所有上面定义的变量都是null.
将var关键字更改为时let,上述代码运行没有问题.
这真的很奇怪,因为据我所知,从这个答案来看,情况恰恰相反.
这是对我的误解,还是我浏览器中的一个奇怪的错误？
您的var变量在全局范围内声明,可以作为全局属性进行访问.它们的值为null因为为什么jQuery或者getElementById这样的DOM方法找不到元素？
有了let它似乎工作,因为let变量不能作为全局对象的属性.所以你得到的不是你的变量,而是全球污染者.全球污染者是一个肮脏的黑暗神奇的东西,它通过他们的ID使全局对象上的元素可用.它应该从未存在过.不要依赖它.这是不好的做法.
console.log(window.divA); // Horrendous !!!!<div id="divA"></div>| 归档时间： |
|
| 查看次数： |
130 次 |
| 最近记录： |