なぜ CSS を上部に、JS を下部に置くのでしょうか?

css が上に配置され、js が下に配置される理由: 1. HTML をロードして DOM ツリーを生成するときに、DOM ツリーを同時にレンダリングできるため、ちらつき、白い画面、または混乱を防ぐことができます。レイアウト; 2. JavaScript のロード これはすぐに実行され、後続のリソースのロードがブロックされます。

この記事の動作環境: Windows7 システム、HTML5&&CSS3 バージョン、DELL G3 コンピューター。

推奨: css ビデオ チュートリアル

href と src の違い

通常、CSS を読み込んで配置するには href を使用します。ヘッダー部分で、src を使用してスクリプトをロードし、本文の下部に配置します。

href

は、ハイパーテキスト参照の略語で、ハイパーテキスト参照を表し、現在の要素とドキュメント間のリンクを確立するために使用されます。一般的に使用されるものには、リンクと a が含まれます。

href を使用して CSS が参照されると、ブラウザはドキュメントを識別して CSS を要求し、並行してダウンロードし、現在のドキュメントの読み込みを停止しません。

src

はsourceの略称で、リソースでありページの重要な部分であり、srcが指す内容が の位置に埋め込まれます。ドキュメント内の現在のタグ。一般的に使用されるものには、img、script、iframe などがあります。

スクリプトで src 参照を使用すると、ブラウザーが要素を解析するときに、リソースが読み込まれるまでドキュメントのレンダリングが停止します。これが、スクリプトが先頭ではなく下部に配置される理由でもあります。

CSS を先頭に配置し、スクリプトを下部に配置する理由

1. CSS を先頭に配置します

HTML を読み込んで、 DOM ツリー。DOM ツリーを同時にレンダリングできます。

これにより、ちらつき、白い画面、またはレイアウトの混乱を防ぐことができます。

2. 最後に javascript を配置します。

javascript は DOM ツリーの構造を変更する可能性があるため、安定した DOM ツリーが必要です。

JavaScript はロード直後に実行され、後続のリソースのロードがブロックされます。 (JavaScript の読み込みと実行の特徴)

知識を広げる:

1. まず、いくつかの一般的な問題を理解しましょう:

1. ページを最適化するときは、次のことが必要です。 CSS を先頭に、js ファイルを最後に配置します。ページを最適化するためにこれができるのはなぜですか?

2. jquery を使用する場合、なぜ $(document).ready に関数を記述するのですか? （） 事件？

3.javascript は dom の解析をブロックします。

解析プロセス中に