勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

バニラJavaScriptのDOMContentLoadedとは?

  JavaScript

jQuery等を用いない素のJSで書かれたプログラムを触る機会があり、そのソースコードの冒頭に以下記述があった。

window.addEventListener('DOMContentLoaded', () => {});

これ何? となったので調べた結果をメモ。

 

DOMContentLoadedイベント

HTMLページの読み込みが完了し、HTMLの解析及びDOMツリーの構築が完了した時点で発生するイベントらしい。詳細は以下の通り。

https://www.javadrive.jp/javascript/event/index15.html

 

jQueryでは

jQueryだと最初に以下のように記述し、「$()」の部分はHTMLが読み終わった後に発火させるみたいな意味と記憶していたが、これはそのまんまDOMContentLoadedと同じことらしい。

$(funciton(){
    //ここに色々記述
});

 

 - JavaScript

  関連記事

JavaScriptにてaddEventListenerで実行する関数に対して引数を渡す方法

JavaScriptにてaddEventListenerで実行する関数に対して引 ...

reCAPTCHA v2でAjaxは使わずにチェック状況を確認する方法

reCAPTCHA v2を実装する案件があり以前の記事を参考に組み込んでみたもの ...

ajaxのエラー詳細を取得する

success or errorで分岐処理はできるけど、 エラー詳細取れないの? ...

日本地図のクリッカブルマップをjQueryで実装する方法(japan-map)

JavaScriptもしくはjQueryで日本地図を表示し、都道府県や八地方区分 ...

FileReader APIを用いて画像をアップロードせずにサムネイル表示

以前にFile APIを用いてファイル名やサイズ、形式(拡張子)を取得するメモを ...