Mein setInterval ändert sich nicht, auch wenn meine Variable

Question

ist

Das ist mein Code-Snippet für die setInterval:

var t = 0; 
    var speed = 1000; 

// To display the speed 
    setInterval(displaySpeed, 100); 

    setInterval(timer, speed); 

// To diplay the speed as well 
function displaySpeed(){ 
    document.getElementById("Tem").textContent = speed; 
} 

function speedUp(){ 
    speed = speed - 100; 
} 

function slowDown(){ 
    speed = speed + 100; 
} 

function timer(){ 
    t = Math.floor(Math.random() * 16) + 1; 
    changeBackground(); 
} 

Die SpeedUp() und Verlangsamung() auf eine Schaltfläche mit Onclick verbunden sind. Die Schaltflächen ändern die Variable, aber nicht die tatsächliche Geschwindigkeit. Die Timer-Funktion ist eine zufällige Nummer zwischen 1 und 16 wählen.

Answer 1

EDIT: Dieser Code zeigt, was/u/torazaburo in Ihrer Frage beantwortet. Fügt eine Zuckerfunktion hinzu, um das Intervall neu zu erstellen, und beide Methoden speedUp() und slowDown() müssen gelöscht werden, um die Geschwindigkeit zu ändern.

var intervalRef = setInterval(timer, speed); 

function updateTimerSpeed(newSpeed) { 
    intervalRef = setInterval(timer, newSpeed); 
} 

function speedUp() { 
    clearInterval(intervalRef); 
    speed = speed - 100; 
    updateTimerSpeed(speed); 
} 

function slowDown() { 
    clearInterval(intervalRef); 
    speed = speed + 100; 
    updateTimerSpeed(speed); 
}