39

asyncJavaScript インクルージョン HTML に属性を追加しました。
だから今私は持っている： 

<script async src="jquery.myscript.js"></script>

そして、これは、jquery を除くすべての、ロードするすべての JS で機能します。

asyncjQueryタグに追加すると<script>、jquery に依存する他のすべてのスクリプトが機能しなくなります。

その jsfiddle で問題を確認できます:
JsFiddle

この例では<script> Mycode </script>、外部の file.js を含める代わりに使用しましたが、状況は変わりません。

async 属性を指定して jQuery を実行し、jquery がロードされた後でのみ、他のいくつかの外部スクリプトを非同期で実行したいと考えています。

可能です？

4

5 に答える 5

24

async 属性を指定して jQuery を実行し、jquery がロードされた後でのみ、他のいくつかの外部スクリプトを非同期で実行したいと考えています。

どういう意味ですか？最初に jQuery をロードし、それが完了したら他のものをロードするように思えます。したがって、同期的にロードする必要があります。それでもこの方法を使用したい場合は、 jQuery の準備ができたら、他のものを引き続きロードasyncする関数を定義できます。onloadまたは、 を使用できますdefer。これらは両方ともここで説明されています: https://davidwalsh.name/html5-async

于 2013-02-11T12:11:44.367 に答える
3

再帰関数の使用

私はこの仕事をとてもうまくやる関数を書きました。

// scripts.js


function loadScripts(urls, length, success){
    if(length > 0){
        script = document.createElement("script");
        script.src = urls[length-1];
        console.log();
        script.onload = function() {
            console.log('%c Script: ' + urls[length-1] + ' loaded!', 'color: #4CAF50');
            loadScripts(urls, length-1, success);               
        };
        document.getElementsByTagName("head")[0].appendChild(script);
    }
    else{
        if(success){
            success();
        }
    }
}

/* Write links sorted from last one to first to load */
/* Here, jquery will be loaded first, then materialize and then wow libray. */
urls = [ '/js/wow.js', '/js/materialize.js',  '/js/jquery.js'];

loadScripts(urls, urls.length, function(){
    /* Codes inside of here will be executed after js files load */

});

これらのコードを次のようなファイルに入れscripts.js、属性を付けてロードできasyncます。

<script async src="js/scripts.js"></script>

css async load については、この回答の編集版を参照してください。

于 2017-11-14T19:04:58.733 に答える