Javascript Scope, Start кнопки остановки, используя интервал

Question

У меня проблема с областью действия.

У меня есть кнопка остановки, которая не работает. Кнопка «Пуск» прекрасно работает, но мне кажется, что кнопка «Стоп» не работает, и я знаю, что это как-то связано с областью действия. Буду признателен за любую помощь.

let css = document.querySelector('h3');
let color1 = document.querySelector(".color1");
let color2 = document.querySelector(".color2");
let color3 = document.querySelector(".color3");
let degree = document.querySelector(".degree");
let body = document.getElementById("gradient");
let deg = document.getElementById("deg");
let random = document.getElementById("random");
let start = document.getElementById("start");
let stop = document.getElementById("stop");


function setGradient() {
  body.style.background =
    "linear-gradient(" +
    degree.value +
    "deg, " +
    color1.value +
    ", " +
    color2.value +
    ", " +
    color3.value +
    ")";

  css.textContent = body.style.background + ";";
  deg.textContent = degree.value;
}

function increment() {
  degree.value = 0;
  setInterval(function() {
    degree.value = degree.value % 360 + 1;
    setGradient();
    if (degree.value == 359) {
      increment();
    }
  }, 100);
}

start.addEventListener("click", increment);

stop.addEventListener("click", function() {
  clearInterval(counter);
});

color1.addEventListener("input", setGradient);
color2.addEventListener("input", setGradient);
color3.addEventListener("input", setGradient);
degree.addEventListener("input", setGradient);

window.onload = setGradient;

Answer 1

Вы должны присвоить переменную counter.

counter = setInterval(..)