JSスクリプトdeferの役割の例

defer の機能は、オブジェクトが見つからないという問題を回避するために、ドキュメントがロードされた後にスクリプトを実行することです。以下に良い例がありますので、興味のある方は参照してください。

<script src="../cgi-bin/delscript.js" defer></script> 
中的defer作用是文档加载完毕了再执行脚本,这样回避免找不到对象的问题---有点问题 
<button id="myButton" onclick="alert(&#39;ok&#39;)">test</button> 
<script> 
myButton.click(); 
</script> 
<script> 
myButton.click(); 
</script>
<button id="myButton" onclick="alert(&#39;ok&#39;)">test</button> 
<script defer> 
function document.body.onload() { 
alert(document.body.offsetHeight); 
} 
</script>

追加された defer は、ページが完全にロードされた後に実行されることを意味します。これは window.onload と同等ですが、アプリケーションでは window.onload よりも柔軟です。

defer は、スクリプト プログラムの強力な機能の中でも「縁の下の力持ち」です。これは、スクリプト セグメントにすぐに実行する必要のないコードが含まれていることをブラウザーに伝え、SRC 属性と組み合わせて使用​​すると、これらのスクリプトがバックグラウンドでダウンロードされ、フォアグラウンドのコンテンツが表示されるようにすることもできます。通常通りユーザーに。
ただし、ドキュメントがロードされた後にスクリプトを実行します。

最後に、次の 2 つの点に注意してください。

1. defer タイプのスクリプト セグメントで document.write コマンドを呼び出さないでください。 document.write は直接的な出力効果を生み出します。
2. また、遅延スクリプトセグメントには、即時実行スクリプトで使用されるグローバル変数や関数を含めないでください。

パフォーマンスを最適化する一般的な方法は、スクリプトをすぐに実行する必要がない場合に、<script> タグに「defer」属性を設定することです。 (即時スクリプトはファンクション ブロックに含まれていないため、読み込みプロセス中に実行されます。) 「defer」属性を設定した後、IE はスクリプトが読み込まれて実行されるのを待つ必要がありません。こうすることで、ページの読み込みが速くなります。一般に、これは、即時スクリプトが関数ブロックに配置され、ドキュメントまたは本文オブジェクトの onload ハンドラーで関数を処理するのが最適であることも意味します。このプロパティは、ボタンをクリックしたりマウスを特定の領域に移動したりするなど、ユーザーのアクションに依存するスクリプトがある場合に役立ちます。ただし、ページの読み込み中または読み込み後に実行する必要があるスクリプトがいくつかある場合、defer 属性を使用するメリットはあまり大きくありません。 </script>

過去 2 日間、Web サイトの全文表示にエラーが発生したのはすべて遅延のせいです。

先週末、このサイトでは広告への投資によってページのインポート時間が長くなるのを防ぐために、Google 広告のコードを変更し、defer を使用して広告のインポートを遅らせました。 FireFoxブラウザでは問題は見つかりませんでした。今日、友人が情報を確認するためにこのサイトに来ました。彼女は、記事を確認するとすぐにページが消えてしまったと言いました。このウェブサイトは過去 2 日間でアクセスが低下していませんか?理由を確認したところ、Firefox では defer が無効のようで、実際には元のコンテンツがページに読み込まれるのに対し、IE では Google のスクリプトの読み込みが遅れたため、defer が原因であることがわかりました。 Ad script は Document.write の書き込みメソッドを使用しており、遅延のため。 Google ADのスクリプトはiframeとして検出されるため、実際のGoogle広告の内容を取得するとページ全体がカバーされてしまい、あっという間に全文が表示されてしまいます。

このようにコードを変更してテストしなかったのはすべて私の責任であり、今後何を変更するにしても、IE と FireFox の両方でテストする必要があることを表明したいと思います。過去 2 日間、アクセスが困難であったことを心よりお詫び申し上げます。
もう 1 つ: このサイトにアクセスするには FireFox を使用することをお勧めします。アクセス速度と解析速度、ページ レイアウトの一貫性が向上します。

上記はこの章の全内容です。その他の関連チュートリアルについては、JavaScript ビデオ チュートリアル をご覧ください。