TIL 6. JavaScriptの実行場所

3099 ワード


JavaScriptの使用方法


1)htmlでの宣言と使用方法
-.headまたはbodyラベルにscriptラベルを指定します.
<head>
  <script>
    document.write("Hello");
  </script>
</head>
2)外部から宣言されたJavaScriptファイルを読み込み、現在のドキュメントに適用します.
頭の中は下と同じだ呼び出しjs
<script src="000.js"></script>
3)運転位置

  • headに挿入すると
    -.ブラウザレンダリングが干渉されているため、再スクリプトの実行中に不完全な画面が長時間表示されます.
    -.ドキュメントの初期化または設定に使用される軽量レベルのスクリプト
    -ドキュメントを必要とするドキュメントオブジェクトモデル(DOM)構造のスクリプト、ドキュメント.正常に動作するにはonloadなどのロードイベントを追加する必要があります.

  • bodyエンドポイントに挿入する場合:
    -ブラウザがレンダリング完了後にスクリプトを実行するため、コンテンツを変更するスクリプトが画面に表示されます.
    -ドキュメントのDOM構造が完了したときに実行し、他の設定は不要
    -.複数のスクリプトの場所への推奨

  • head+asyncプロパティ(asyncスクリプトまたは非同期スクリプト)
    -バックグラウンドからスクリプトをダウンロードし、ダウンロード中にページの内容を処理および出力します.
    (asyncスクリプトの実行時にHTMLスライスが停止)
    -ページにasyncスクリプトが複数ある場合は、実行順序が異なります.
    (ダウンロード完了スクリプトを先に実行)

  • head+deferプロパティ(deferスクリプトまたは遅延スクリプト)
    -バックグラウンドからスクリプトをダウンロードし、ダウンロード中にHTMLパケットを停止しません.
    -.スクリプトを並行してダウンロードし、ダウンロード順に関係なくドキュメントに追加する順序で実行します.
    -.deferプロパティは外部スクリプトにのみ有効です
    -.適切なデータサイズと方法を利用!!
    -完全なDOMが必要なスクリプトまたは実行順序に.deferを適用することが重要です.
    -.asyncは、アクセス者数や広告スクリプトなど、実行順序が重要でない場合に適しています.
  • その他のコメント


  • 「use strict」:Stric Mode宣言のセキュリティコーディングガイド
    -コードに対してより良いエラーチェックを適用する方法
    -.不正な構文を予め検出できる

  • varの問題
    -.var昇格:宣言がどこにあるかにかかわらず、宣言を一番上に昇格
    -.var:どの場所に宣言してもブロックは区別されません

  • その他の変数宣言
    -.let:変数の設定(後でoを変更)
    -.connst:変数の設定(後でxを変更)
    -.number:数値データ型(整数、実数なし)