javascript - 无法制作打开/关闭 window.scrollBy() 的按钮

Question

我正在尝试创建一个按钮，单击该按钮时窗口会自动滚动，再次按下该按钮时它会关闭。

这是到目前为止我取得的进展的 fiddle :

https://jsfiddle.net/swurvinmervin/n7poL3hw/34/

HTML:

<div class = "b">
<p>pretend button</p>
</div>

样式:

div {
    width: 50px;
    height:5000px;
    background: red;
}

Javascript:

var button = document.querySelector("div");

button.addEventListener("click",buttonFunction);

function buttonFunction() {
    if (button.classList.contains("b")){
        button.classList.add("a");
        button.classList.remove("b");
    } else {
        if (button.contains("a")){
            button.classList.add("b");
            button.classList.remove("a");
        }       
    }

    var i = 0;

    var winScroll = setInterval(function() {
        if (button.classList.contains("a")){
            window.scrollBy(0,500);
        } else {
            if(button.classList.contains("b") ){ 
                clearInterval(winScroll);
            }
        }  
    }, 200);
}

Answer 1

function buttonFunction() {
    if (button.classList.contains("b")){
        button.classList.add("a");
        button.classList.remove("b");
    } else {
        if (button.classList.contains("a")){
            button.classList.add("b");
            button.classList.remove("a");
        }       
    }

    var i = 0;

    var winScroll = setInterval(function() {
        if (button.classList.contains("a")){
            window.scrollBy(0,500);
        } else {
            if(button.classList.contains("b") ){ 
                clearInterval(winScroll);
            }
        }  `enter code here`
    }, 200);
}

else block 中的 if 条件有错误应该是 if (button.classList.contains("a") 而不是 if (button.contains("a")) classlist is missing before .contains