javascript isConnectedでドキュメントオブジェクトモデル (DOM) に接続されているかを判定する

javascript isConnectedでドキュメントオブジェクトモデル (DOM) に接続されているかを判定する

javascriptで、isConnectedを使用して、ドキュメントオブジェクトモデル (DOM) に接続されているかを判定するサンプルコードを掲載してます。ブラウザはchromeを使用しています。

環境

  • OS windows10 pro 64bit
  • Apache 2.4.43
  • ブラウザ chrome 84.0.4147.105

isConnected使い方

isConnectedを使用すると、ドキュメントオブジェクトモデル (DOM) に接続されているかを判定することが可能です。
※ノードは、要素ノードだけでなく、改行を含んだテキストノードやコメントノードも存在します。

isConnected使い方

実行結果を見ると、接続される前はfalseで、接続された後はtrueが表示されているが確認できます。

また、以下のコードを、

document.getElementByIdの省略を使用して、簡潔に記述することもできます。

サンプルコード

以下は、
「配置」ボタンをクリックして、生成した要素を配置した判定結果を表示するだけの
サンプルコードとなります。

※cssには「tailwind」を使用して、アロー関数で関数は定義してます。

判定結果が変更されていることが確認できます。