js 菜鸟级问题。。

Question

下面的代码中 标记1和标记2处的代码相同，但是相同的代码在这两处一个是全局变量一个是局部变量，结果为什么使用标记2处的代码且注释标记1，则程序可实现图片切换，反过来注释标记2，使用标记1处，则图片不切换。。 是什么道理啊？<script language =javascript >          var curIndex = 0;        //时间间隔 单位毫秒         var timeInterval = 1000;        var arr = new Array();        arr[0] = "1.jpg";        arr[1] = "2.jpg";        arr[2] = "3.jpg";        arr[3] = "4.jpg";        arr[4] = "5.jpg";        arr[5] = "6.jpg";        arr[6] = "7.jpg"; 
​var obj = document.getElementById("showpic");// 标记1        setInterval(changeImg, timeInterval);         function changeImg() {        //   var obj = document.getElementById("showpic");// 标记2            if (curIndex == arr.length - 1) {                curIndex = 0;            }            else {                curIndex += 1;            }            obj.src = "image/" + arr[curIndex];        } </script> <img src="image/1.jpg" width="427" height="219" id="showpic" />  
​​

Answer 1

这就是局部变量与全局变量的区别了，这应该是比较基础的，好好理解下
你用标记1的代码，obj对象值是不会变化的，即为全局，当然图片无法切换了

Answer 2

原因：
1.如果你用标记2的代码，那么第一次执行时是在一秒后，或许图片对象#showpic已经加载。
2.如果你用标记1的代码，那么怀疑你这段js是直接写到html中的，而不是写在文档的加载事件中，那么标记1的代码中定义的obj是为null的，所以程序出错，而不是不切换。解决办法：将script写到img标签后面或者在body的onload事件中写js代码。

Answer 3

标记1的代码执行时img对象未加载，所以obj为null