SOURCE

window.onload=function(){

var ostartTimerBtn = this.document.getElementById("startTimer");
    var ostopTimerBtn = this.document.getElementById("stopTimer");
    var oTimerBox = this.document.getElementById("timerBox");
    var oTimer;

    ostartTimerBtn.addEventListener("click",function()
    {
        if(oTimer)
        {
            window.clearTimeout(oTimer);
        }
        oTimer = window.setTimeout(function()
        {
            oTimerBox.style.backgroundColor = "blue";
        },2000);
    });




var oStartIntervalBtn=this.document.getElementById("startInterval");

var oStopIntervalBtn=this.document.getElementById("stopInterval");
var oIntervalBox=this.document.getElementById("intervalBox");
var oIntervalText=this.document.getElementById("intervalText");
var oInterval;
var count=5;
oIntervalText.innerHTML=count;

function changeColor(){
    var colors=["red","green","pink","yellow","lightskyblue"];
    if(count>0){
        count--;
        oIntervalBox.style.backgroundColor=colors[count];
        oIntervalText.innerHTML=count;
    }
    else{
        count=5;
    }
}


oStartIntervalBtn.addEventListener("click",function(){
    if(oInterval){
        window.clearInterval(oInterval);
    }
    oInterval=window.setInterval(changeColor,1000);
});

oStopIntervalBtn.addEventListener("click",function(){
    if(oInterval){
        window.clearTimeout(oInterval);
    }
});

}

 <br/>
    <div>
        <button id = "startTimer">开始</button>
        <button id = "stopTimer">结束</button>
        <div id="timerBox"></div>
    </div>
    <br/>
    <div>
        <button id = "startInterval">开始</button>
        <button id = "stopInterval">结束</button>
        <div id="intervalBox"></div>
        <span>倒计时：</span><span id="intervalText"></span>
    </div> 

#timerBox {
    width: 100px;
    height: 100px;
    border : 1px solid black;
    background-color: lightblue;
}

#intervalBox {
    width: 100px;
    height: 100px;
    border : 1px solid black;
    background-color:royalblue;
}