【JavaScript入門】任意のタイミングでイベントを実行するdispatchイベント

dispatchイベントを使うと、例えばユーザがボタンをクリックしていなくても、任意のタイミングでクリックイベントを呼べたりできるようになります。

See the Pen
dispatch by shiakisudev (@shiakisu)
on CodePen.

HTML

<button id="btn">現在日時取得</button>
<div id="time"></div>

window.addEventListener('DOMContentLoaded', function(){
    let button = document.getElementById("btn");
    button.addEventListener("click",displayTime,false);

    function displayTime(){
        let now = new Date();
        document.getElementById("time").textContent = now.toLocaleString();
    }

    //１秒ごとにクリックイベントを呼び出す。
    let event = new Event("click");
    window.setInterval(function(){
        //以下のコードが実行されたタイミングでユーザがクリックをしたのと同じことになる。
        button.dispatchEvent(event);
    },1000);
});