Button[index - 1]报错未定义。

Question

        window.onload=function()
        {
            var Box = document.getElementById("Box");
            var Picture = document.getElementById("Picture");
            var Button = document.getElementById("Button").getElementsByTagName("span");
            var arrow_left = document.getElementById("arrow_1");
            var arrow_right = document.getElementById("arrow_2");
            var index = 1;

            function ShowButton()
            {
                Button[index - 1].className = "show";
            }

            function Scroll(offset)
            {
                var NewLeft = parseInt(Picture.style.left) + offset;
                Picture.style.left = NewLeft + "px"
                if(NewLeft > -600)
                {
                    Picture.style.left = -1800 + "px";
                }
                if(NewLeft < -1800)
                {
                    Picture.style.left = -600 + "px";
                }
            }
            arrow_left.onclick=function()
            {
                index += 1;
                ShowButton();
                Scroll(600);
            }

            arrow_right.onclick=function()
            {
                index -= 1;
                ShowButton();
                Scroll(-600)
            } 
        }
        </script>

报错：TypeError: Button.NaN is undefined

如题，写到圆点跟随图片切换高亮的时候，这行代码报错了；我认为应该是变量index为局域变量，无法在其他封装函数里使用造成的，不知道是不是这样……翻了下课程下面的答案，好像没有和我情况遭遇一样的同学。

Answer 1

你的index是在onload中定义的，如果不依靠传参，当然不能在内部方法中调用，所以才会给出上面的报错。

Answer 2

请使用 isNaN() 来判断一个值是否是数字。原因是 NaN 与所有值都不相等，包括它自己。我看到有NAN这里应该是类型有问题吧，