为什么不能运行轮廓图动态

<body style="background: darkgray;">

    <div class="big">

        <img src="作业/s1.jpg" id="big" ondblclick="info(this)">

    </div>

    <div id="small"></div>

    <img src="img/s1.jpg" width="15%">

    <img src="img/s2.jpg" width="15%">

    <img src="img/s3.jpg" width="15%">

    <img src="img/s4.jpg" width="15%">

    <img src="img/s5.jpg" width="15%">

    <script>

        var big = document.getElementById('big');

        var num = 1;

        setInterval(function() {

 

            num++;

            if (num == 6) {

                num = 1;

            }

            big.src = "作业/s" + num + ".jpg"

        }, 5000)

        var list = document.getElementById("small").getElementsByTagName("img");

        for (var i = 0; i <= list.length; i++) {

            list[i].onmouseover = function() {

                this.style.opacity = 0.8;

                this.style.border = "1px solid #f00";

            }

            list[i].onmouseout = function() {

                this.style.opacity = 1;

                this.style.border = "1px solid #ccc";

            }

            list[i].onclick = function() {

                var big = document.getElementById('big')

                big.src = this.src

            }

        }

 

        function info(x) {

            alert("当前的图片为:" + x.src)

        }

    </script>

不知道你这个问题是否已经解决, 如果还没有解决的话:

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^