CSSとスクリプトの位置

レンダリング速度の観点からは、<script>...</script>と<style>...</style>の位置はどこですか？ <head>...</head>内、または<body>...</body>の末尾またはその直後ですか？そして、<base>のように、<head>...</head>の通常の位置の外に置くことができる他のタグはありますか？CSSとスクリプトの位置

出典

2012-02-25 sawa

[html5] HTML5やCSS3と何の関係もない質問については、CSS3タグを使用してください。 – BoltClock

@BoltClockこれらの質問をすると、html5とそれ以前とcss3との間に仕様に違いはありません。答えがhtml5とcss3についてです。タグ付けに問題はありますか？ – sawa

'html'タグは' html5'を含む 'html'のすべてのバージョンをカバーします。あなたの質問がHTML5について*具体的に*の場合にのみ 'html5'にタグを付けるべきです。 CSS/CSS3と同じです。 –

<style>および<link rel="stylesheet">は<head>である必要があります。そうでない場合、ページはスタイルなしでレンダリングされ、スタイルがロードされたときに不快に変化します。一方、いずれの場所にあってもよい。個人的には、外部のJSファイルを<head>（通常は関数を定義するファイル）にロードし、ページ自体に影響を与えるスクリプトは</body>の直前にあり、実行前にすべての要素が利用可能であることを保証します。

私はこれまで書いた新しいスクリプトフレームワークを持っていますが、<script>要素はどこにでも置くことができますが、コードは延期され、</body>の直前に配置されているかのように実行されます。これにより、ページ読み込みに悪影響を及ぼすことなく、影響を受けるページの部分にスクリプトを近づけることができます。

出典

2012-02-25 05:42:43

Kolink氏によると、CSSスタイルは<head>セクションにあるので、スタイルは適用されずにページがレンダリングされることはありません。

<scripts>が本文の末尾にある場合は、<body>タグの直前に最大ページレンダリング速度が得られます。これは、スクリプトが解析されて実行される前ではなく、スクリプトが解析または実行される前にページをレンダリングできるためです。任意の特定の順序で実行する必要はありません

<scripts>も、最近のブラウザでdeferまたはasyncとしてマークすることができ、これは彼らのロードと解析がHTMLのロードと表示して直列化復元されることになります。

これは、ユーザーのイベント（マウスの動き、クリック、キーなど）に応答するもののようなものですが、すべてには実現できません。 document.write()をページの内容に直接読み込む必要があります。したがって、ページが読み込まれるコードの前にロードする必要があります。したがって、ページが解析されてレイアウトされている間に使用できるように、通常は<head>セクションに含まれます。

出典

2012-02-25 05:51:34 jfriend00

答えて

関連する問題