请问首页幻灯片这种js写法有什么问题？为什么不成功？谢谢

Question

<script>
    window.onload = function(){
        var bigBox = document.getElementById('slidebox');
        var smallBox = bigBox.getElementsByTagName('div');
        var nums = bigBox.getElementsByTagName('li');
        var pic = smallBox.getElementsByTagName('img');
        var arr = [
        "d:/ddy/images/01.jpg",
        "d:/ddy/images/02.jpg",
        "d:/ddy/images/03.jpg",
        "d:/ddy/images/04.jpg",
        ];

        for(var i=0;i<nums.length;i++){
            nums[i].index = i;
            nums[i].onmouseover = function(){
                for(var i=0;i<nums.length;i++){
                    nums[i].className = '';
                }
                this.className = 'current';
                pic.src = arr[this.index];
            }
        } 
    }   

</script>

这是js部分；
html贴上吧：

<div class = "slidebox" id = "slidebox">
    <div class = "slide">
        <img src = "d:\ddy\images\01.jpg" />
    </div>
    <ul class = "btns">
        <li class = "current">1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
    </ul>
</div>

css额：

.slidebox{width: 900px;height: 310px;margin: 0 auto; z-index: 0;position: relative;}
.slide{z-index: 1;position: absolute;}
.btns{z-index: 9999;bottom: 10px;position: absolute;right: 5px;}
.slide img{width: 900px;height: 310px;}
.slidebox ul li {width:18px;height: 18px; float: left;margin-right: 5px;text-align: center;background: #666;font: 12px arial;line-height: 18px;text-decoration: none;color: #fff;}
.slidebox ul .current{background: #f33;}

Answer 1

不同于getElementById(), getElementsByTagName()返回的不是一个element，而是一个a list of elements，所以应该这样写：

var bigBox = document.getElementById('slidebox');
var smallBox = bigBox.getElementsByTagName('div')[0];
var nums = bigBox.getElementsByTagName('li');
var pic = smallBox.getElementsByTagName('img')[0];