30

HTML/CSS やテキストなどの読み込みが完了してからスクリプトを読み込むことをお勧めします。基本的に同じことを行う defer 属性について知りました。つまり、スクリプトを取得して実行する前に、ページの読み込みが完了するまで待機します。

では、defer 属性を使用する場合、script タグをページの下部と head タグの内側に物理的に配置する必要がありますか?

読みやすくするためには、スクリプト タグを head セクション内に保持する方がよいと思います。

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

また

<script defer="defer">

// do something

</script>
4

5 に答える 5

8

現在のベストプラクティスは？古いブラウザ（IE <10、Opera Miniなど）をサポートする必要がない限り、先頭で遅延スクリプトを順番に使用します-97.45％のブラウザ使用率（ ref）

なんで？を使用deferすると、bodyタグの最後にスクリプトを配置した場合と同じように解析が終了しますが、スクリプトはHTML解析と並行してダウンロードされているため、全体としてスクリプトの実行はかなり前に終了します。このシナリオdomInteractiveでは、ページの読み込み速度に使用されるより高速なイベントがトリガーされます。を使用asyncすると、スクリプトが実行される順序は、スクリプトのフェッチ速度によって異なるため、順序が損なわれる可能性があります。さらに、asyncスクリプトはインラインで実行され、HTMLの解析を一時停止します。

于 2012-09-13T23:49:44.143 に答える
2

まず第一に、defer 属性はすべてのブラウザーでサポートされているわけではありません (サポートしているブラウザーの中には無視するものもあります)。スクリプトをページの下部に配置すると、スクリプトが実行される前に、その上にあるすべての HTML 要素が DOM に読み込まれます。別の方法として、onloadメソッドを使用するか、jQuery のDOM 対応関数を使用します。

于 2012-09-13T23:43:39.613 に答える
1

「defer」を使用してヘッダーにスクリプトを配置すると可読性が向上することに同意しますが、この属性はまだデスクトップとモバイルの両方の Opera でサポートされていません (詳細については、この表を確認してください)。

于 2012-09-13T23:42:42.990 に答える