ホームページ  >  記事  >  ウェブフロントエンド  >  async 属性を使用して JavaScript メソッドを非同期にロードして実行する

async 属性を使用して JavaScript メソッドを非同期にロードして実行する

coldplay.xixi
coldplay.xixi転載
2020-06-17 16:17:082780ブラウズ

async 属性を使用して JavaScript メソッドを非同期にロードして実行する

私が HTML5 に興奮している最大の理由の 1 つは、HTML5 に実装された新しい関数や機能は、私たちが長い間楽しみにしていたものばかりだからです。たとえば、以前はプレースホルダーを使用していましたが、JavaScript で実装する必要がありました。 HTML5 の JavaScript タグに提供される async 属性を使用すると、JavaScript を非同期にロードして実行できます。以前は、この機能を実現するにはさまざまな JavaScript プラグインが必要でしたが、この新しい属性により、非同期読み込みを簡単に実装できるようになりました。

async – HTML コード

これは非常に簡単で、次のようになります:

<script async src="siteScript.js" onload="myInit()"></script>

実際、厳密なプログラマーであれば、## の 90% 以上を行う必要があります。 #SCRIPT タグは async 属性を使用します。

defer – HTML コード

async 属性に似た defer 属性もあります:

<script defer src="siteScript.js" onload="myInit()"></script>

および

async 属性の構文は非常に似ています。

async と defer – 違い

この WebKit ブログでは、

deferasync の 違いについて非常に明確に説明しています:

ブラウザは、

async 属性または defer 属性でマークされたスクリプトをすぐに読み込んで解析し、このスクリプトに依存する初期化もサポートします。 async 属性と defer 属性の違いは、スクリプトがいつ実行されるかです。 async 属性でマークされたスクリプトは、ダウンロードの完了後に、ウィンドウの読み込みイベントを待たずに実行されます。これは、async 属性でマークされたスクリプトが、ページに埋め込まれた順序で実行されるとは限らないことを意味します。 defer 属性でマークされたスクリプトは、ページに表示される順序で実行されます。実行は、解析が完全に完了した後、ドキュメントの DOMContentLoaded イベントの前に開始されます。

非同期属性と遅延属性をサポートしているブラウザは何ですか?

Safari ブログからの引用:

WebKit エンジン ブラウザ (Google Chrome および Safari)。 Firefox は、バージョン 3.6 以降、async 属性と defer 属性をサポートします。 IE も長い間 defer 属性をサポートしていましたが、async 属性はサポートしておらず、onload 属性は IE9 でサポートされました。

#非同期はとても便利です!

さまざまなブラウザが

async

関数を実装しているのを見ると、とてもうれしく思います。 Web サイトのページを閲覧するときに JavaScript によってスタックするのは確かに大きな問題ですが、async 属性の非同期読み込みおよび実行機能により、Web サイトのページ速度が確実に向上します。 推奨チュートリアル: 「

JavaScript 基本チュートリアル

以上がasync 属性を使用して JavaScript メソッドを非同期にロードして実行するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はwebhek.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。