勉強したことのメモ

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で画像を取り扱う際の注意
javascriptで画像を取り扱う際の注意

javascriptで画像を取り扱う際に、 ちゃんと要素を指定しているのにも関わ ...

highcharts.jsについて
highcharts.jsについて

プログラムの作りかえを行う際、既存のソースで highcharts.jsを使って ...

Javascript / jQueryにて特定の要素内の文字数が〇文字以上の場合に丸める方法
Javascript / jQueryにて特定の要素内の文字数が〇文字以上の場合に丸める方法

サイトの特定の要素内の文字数が〇文字以上の場合に「コンテンツコンテ……」のように ...

Leafletにて表示されているマップを画像としてダウンロードさせる「leaflet-easyPrint」の利用方法
Leafletにて表示されているマップを画像としてダウンロードさせる「leaflet-easyPrint」の利用方法

Leafletにて何らかのボタンをクリックすると表示されているマップを画像として ...

leaflet.jsとOSMで現在地を取得しマップ上にマーカーを表示する方法
leaflet.jsとOSMで現在地を取得しマップ上にマーカーを表示する方法

leaflet.jsとOpenStreetMapで現在位置の経度緯度を取得しマッ ...