2013-10-15 55 views
0

我对可变范围有点困惑。下面的代码不会正确执行playerDetails函数 - 除非我在函数块内声明变量“panel”。全局变量无法识别Javascript

但是 - 我想如果一个变量被声明在一个功能块之外,它因此具有全局范围 - 并且对于所有功能块都是可见的。

总之 - 我可以通过将第一行移动到playerDetails功能块来获得代码 - 我只是不明白为什么我需要这样做。任何帮助将非常感激。

谢谢。下面的代码;

var panel = document.getElementById ("panel") ; 

function init() 
{ 
var player1 = {name: "DJCraigo" , score: 178242 , rank: "1st"} ; 
var player2 = {name: "Tohny" , score: 155522 , rank: "2nd"} ; 
player1.showDetails = playerDetails ; 
player2.showDetails = playerDetails ; 

player2.showDetails() ; 

player1.showDetails() ; 
} 

function playerDetails() 
{ 
    panel.innerHTML += "Player with name " + this.name + " is ranked " + this.rank + " with a   score of " + this.score + "<br>" ; 
} 
document.addEventListener ("DOMContentLoaded" , init , false) ; 
+4

当您发出'getElementById(“panel”)'时,DOM可能还没有准备好。你应该像'init()'函数一样将这个操作绑定到'DOMContentLoaded'。 –

+0

只需将您的JavaScript放在''标签内。 – benastan

+0

见http://stackoverflow.com/a/1471738/891338 – redDevil

回答

1

只有在读取时才执行声明/面板变量初始化的行。而且DOM可能未初始化,所以getElementById不会返回任何内容。

如果你希望你的变量是全局变量,就像你在做的那样声明它,但是在init函数中初始化(getElementById)。

var panel; 
function init() 
{ 
    panel = document.getElementById ("panel") ; 
... 
+0

辉煌,感谢您的帮助 – DJC