2021-03-31

JavaScript: HTML要素に対してクリックイベントを発火させる

button 要素や div 要素等の HTML 要素に対してクリックイベントを発火させたい場合は、 HTML 要素の click() メソッドを使用します。

但し、このclick() メソッドは a 要素に対しては機能しないので注意してください。

参考記事: MDN HTMLElement.click()

書式

elem.click();

サンプルコード

button要素( id="btn" )に対してクリックイベントを発火させるコードです。

HTML

<button id="btn">ボタン</button>

JavaScript

window.onload = function(){

    var b = document.getElementById('btn');
    
    // イベントハンドラ
    b.addEventListener('click', function(){
        console.log('clicked');
    }, false);
    
    // クリックイベントを発火
    b.click();

}

上のコードでは「window.onload」の中に記述していますので、 そのタイミングで "clicked" と表示されます。

このように click() メソッドを使うと、簡単に クリックイベントを発火させることができます。