Question

关于JS中全局变量的问题

<style>
#div1 input {background:#CCC;}
#div1 .active {background:yellow;}
#div1 div {width:200px; height:200px; background:#CCC; display:none;}
</style>
<script>
var aBtn=null;
var aDiv=null;

window.onload=function ()
{
var oDiv=document.getElementById('div1');
aBtn=oDiv.getElementsByTagName('input');
aDiv=oDiv.getElementsByTagName('div');
var i=0;

for(i=0;i<aBtn.length;i++)
{
aBtn[i].index=i;
aBtn[i].onclick=tab;
}
};

function tab()
{
for(i=0;i<aBtn.length;i++)
{
aBtn[i].className='';
aDiv[i].style.display='none';
}
this.className='active';
aDiv[this.index].style.display='block';
}
</script>
<div id="div1">
<input class="active" type="button" value="教育" />
<input type="button" value="财经" />
<input type="button" value="aaa" />
<div style="display:block;">1asdfasdfds</div>
<div>2xzcvxzcv</div>
<div>5332342345</div>
</div>
上面是代码,下面是问题:
为什么使用var aBtn=null作为全局变量，而不是使用var aBtn=oDiv.getElementsByTagName('input')?当使用全局变量var aBtn=null，那么下面的tab函数里面的aBtn指的是什么?理由是?(指的是什么，我可以测试出来，最主要是理由)谢谢！
请重点回答第一个和第三个问号对应的问题，谢谢！

Answer 1

如果用var aBtn=oDiv.getElementsByTagName('input')的话，假如页面没有加载完成的话，aBtn的值是为null的，所以用var aBtn = null作为全局变量，并且在onload事件里面为aBtn赋值，目的就是为了能够正确获取到对应的值。
当使用var aBtn = null，tab函数里面的aBtn指的是var oDiv=document.getElementById('div1');aBtn=oDiv.getElementsByTagName('input');也就是页面中input标签的列表。因为是虽然定义的全局变量是null，但是在onload事件里面已经为aBtn重新赋值了，因此此时的aBtn的值也已经变化为重新赋值后的值了。

Answer 2

jsp页面加载顺序是从上到下执行，使用var aBtn=oDiv.getElementsByTagName('input')会找不到input标签，window.onload是页面加载完成后执行的事件，所以在事件里赋值不会出现这种情况，至于aBtn我想的和楼上的差不多了