ホームページ > 記事 > ウェブフロントエンド > jQueryの使い方
jquery の使用方法: まず、CDN 読み込みまたはファイルのローカル読み込みを通じて jquery ファイルを読み込み、次に jquery ファイルを通じて jQuery コードを実行します。
この記事の動作環境: Windows 7 システム、Dell G3 コンピューター、jquery バージョン 3.2.1。
jQueryの使い方は?この記事では、jQueryとは何なのかを紹介します。なぜjQueryを使うのでしょうか? jQueryの使い方は? jqueryの使い方を皆さんに教えてください。お役に立てれば幸いです。
jQuery とは何ですか?
jQuery は言語ではありませんが、よく書かれた JavaScript コードであり、HTML ドキュメントのトラバーサル、イベント処理、アニメーション、および Ajax インタラクティブを簡略化して高速に実行できます。ウェブ開発。
jQuery を選択する理由
jQuery は非常にコンパクトでよく書かれた JavaScript コードであり、非常に少量のコードを記述することで開発者の生産性が向上し、重要な UI 機能を実装できるようになります。
jQuery の利点は次のとおりです:
1. jQuery を使用するために新しい構文を学ぶ必要はありません。単純な JavaScript 構文を理解するだけで十分です。
2. コードはシンプルかつ明確であり、複数行のコードを記述することなく複雑な機能を実装できます。
3. アプリケーションのパフォーマンスの向上に役立ちます。
4. ほとんどのブラウザと互換性のある Web ページの開発に役立ちます。
5. 数百行のコードを記述せずに、主要な UI 関連の機能を実装するのに役立ちます。
jQuery の使い方
#1. jQuery ファイルをロードします #jQuery は通常、jQuery がすぐに実行できるすべての機能を含む単一の JavaScript ファイルとして提供されます。次の方法で Web ページに含めることができます:
1)、ローカル jQuery ファイルを読み込みます最初に
jQuery ファイルをダウンロードする必要がありますローカルへの jQuery JavaScript ファイルは、jQuery 公式 Web サイト (アドレス: http://www.jquery.com) からダウンロードできます。 次に、jQuery ファイルを読み込みます
<script type="text/javascript" src="jQuery-1.4.1-min.js"></script>
CDN とは何ですか?
CDN はコンテンツ配信ネットワークの略で、コンテンツ配信ネットワークとも呼ばれます。これは、帯域幅を最大化するためにデータ ファイルを含むレプリカ ネットワークに接続されたさまざまなポイントに配置されたコンピューターのグループです。 CDN では、すべてのクライアントが 1 つの特定のサーバーからデータにアクセスするのではなく、クライアントはクライアントの場所に近いデータのコピーにアクセスします。これは、クライアント側でのデータ取得パフォーマンスの向上に役立ちます。
jQuery ファイルのホストに使用できる主な CDN は 2 つあります。
a. Microsoft AJAX CDN からの jQuery の読み込み
ロード可能Microsoft AJAX CDN から jQuery ファイルを読み込みます。詳細については、こちらをご覧ください。次のマークアップをページ内に保持する必要があります。
<script type="text/javascript" language="Javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.min.js"></script>
b. Google ライブラリ API からの jQuery のロード
Google CDN から jQuery ファイルをロードできます。次のマークアップをページ内に保持する必要があります。
<script type="text/javascript" language="Javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"> </script>CDN から jQuery をロードする利点:
1. jQuery ファイルをダウンロードする必要がないため、ページの読み込みが速くなります
2サーバーから jQuery ファイルをロードすることで、帯域幅を節約します。
3. スケーラブル。通常、CDN はこれらのファイルを世界中の地理的に異なる場所にあるサーバーに配置するため、ユーザーがどこで閲覧していても高速にロードできます。ページにアクセスすると、アプリケーションは正常に実行されます。
注:通常、CDN からの jQuery の読み込みとローカル領域からの jQuery ファイルの読み込みは、CDN が利用できないように記述する必要があります。したがって、次のコード行を記述できます:
<!-- START - jQuery Reference --> <script type="text/javascript" language="Javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.min.js"></script> <script type='text/javascript'>//<![CDATA[ if (typeof jQuery == 'undefined') { document.write(unescape("%3Cscript src='/Script/jquery-1.4.1.min.js' type='text/javascript' %3E%3C/script%3E")); }//]]> </script> <!-- END - jQuery Reference -->
2. jQuery コードの実行jQuery コードを実行するには 2 つの方法があります。 。
1. ページが読み込まれたら、jQuery コードを実行します:
<script language="javascript" type="text/javascript"> $(function () { $("#div1").css("border", "2px solid green"); }); </script>
または:
<script language="javascript" type="text/javascript"> $("#div1").css("border", "2px solid green"); </script>
ただし、jQuery が実行する必要がある要素が読み込まれていない場合、エラーが発生するか、望ましい結果が得られないという欠点があるため、この方法で jQuery コードを実行する場合は、次のようにする必要があります。必ず最初に、jQuery を使用する要素をロードしてください (jQuery コードは HTML 要素の後に置くことができます)。
2. 完全な DOM オブジェクト (完全なページが読み込まれたとき) にのみ jQuery を実行します。この時点で、コードを .ready 関数でラップする必要があります。
<script language="javascript" type="text/javascript"> $(document).ready(function () { $("#div1").css("border", "2px solid green"); }); </script>
这是执行jQuery的更好,更安全的方法。这样可以确保只有在浏览器中加载完整页面时才会执行jQuery代码,因此可以放心,用户不会在页面上看到任何不需要的行为。
总结:以上就是本篇文章的全部内容,希望能对大家的学习有所帮助。
以上がjQueryの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。