ホームページ  >  記事  >  ウェブフロントエンド  >  jQueryの使い方

jQueryの使い方

青灯夜游
青灯夜游オリジナル
2018-12-05 16:28:5022195ブラウズ

jquery の使用方法: まず、CDN 読み込みまたはファイルのローカル読み込みを通じて jquery ファイルを読み込み、次に 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 の使い方

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>

2)、CDN から jQuery を読み込みます

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=&#39;text/javascript&#39;>//<![CDATA[
        if (typeof jQuery == &#39;undefined&#39;) {
            document.write(unescape("%3Cscript 
    src=&#39;/Script/jquery-1.4.1.min.js&#39; type=&#39;text/javascript&#39; %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 を使用する要素をロードしてください (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 サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。