ロード時に実行されるJavaScript（run on load js）の方法

1. window.onload イベント:

   window.onload = function() {
   // ここに実行したいコードを記述
   };

   この方法では、ウェブページのすべてのリソース（画像、スタイルシートなど）が完全にロードされた後にコードが実行されます。

2. DOMContentLoaded イベント:

   document.addEventListener("DOMContentLoaded", function() {
   // ここに実行したいコードを記述
   });

   DOMContentLoaded イベントは、HTMLドキュメントのパースが完了し、DOMツリーが構築された後に発生します。この方法は、画像やスタイルシートのロードを待たずにコードを実行するのに適しています。

<script src="script.js" defer></script>

defer 属性をスクリプトタグに追加すると、スクリプトのダウンロードと実行がページの解析とレンダリングの後に行われます。この方法は、コードの順序が重要な場合に便利です。

<script src="script.js" async></script>

async 属性をスクリプトタグに追加すると、スクリプトのダウンロードと実行が非同期に行われます。つまり、スクリプトの実行を待たずにページの解析とレンダリングが続行されます。コードの順序が重要でない場合に使用します。

これらの方法を使用することで、ウェブページのロード時にJavaScriptコードを実行することができます。必要に応じて適切な方法を選択し、コードを実装してください。