请问首页幻灯片这种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];