ホームページ > ウェブフロントエンド > jsチュートリアル > js_javascript スキルを非同期でロードする 4 つの方法についてコメントする

js_javascript スキルを非同期でロードする 4 つの方法についてコメントする

WBOY
リリース: 2016-05-16 15:24:10
オリジナル
1271 人が閲覧しました

js を非同期でロードする 4 つの方法、レビューが始まります。

オプション 1: $(document).ready

<!DOCTYPE html>
<html>
    <head>
        <script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script> 
        <script type="text/javascript">
            $(document).ready(function() {
              alert("加载完成!");
            });
        </script>
    </head>
    <body>
        <img src="http://images.cnitblog.com/i/121863/201405/222202573569862.jpg" />
    </body>
</html>
ログイン後にコピー

コメント:

1. jquery を引用する必要があります

2. すべてのブラウザと互換性があります。

オプション 2: タグの async="async" 属性

async (HTML5 の属性です) の定義と使い方

async 属性は、スクリプトが利用可能になると非同期で実行されることを指定します。

例:

<script type="text/javascript" src="xxxxxxx.js" async="async"></script> 

ログイン後にコピー

コメント:

1. HTML5 の新しい属性は、Chrome、FF、IE9 および IE9+ でサポートされています (IE6 ~ 8 はサポートされていません)。さらに、このアプローチでは、スクリプトが順番に実行されることは保証されません。

2. async 属性は外部スクリプトにのみ適用されます (src 属性を使用する場合のみ)。

オプション 3: タグ <🎜 の defer="defer" 属性>

defer 属性は、ページが読み込まれるまでスクリプトの実行を延期するかどうかを指定します。

一部の JavaScript スクリプトは document.write メソッドを使用して現在のドキュメント コンテンツを作成しますが、他のスクリプトは使用しない場合があります。

スクリプトがドキュメントのコンテンツを変更しない場合は、
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート