English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

jQueryの入門

この章では、jQueryをウェブページに統合する方法を学びます。

jQueryをウェブページに追加する

jQueryを使用する方法は2種類あります:

  • からjQuery.comjQueryライブラリをダウンロードする

  • Google、BaiduなどのCDNに含まれるjQueryを含める

jQueryをダウンロードする

まず、jQueryのコピーをダウンロードして、ドキュメントに含めます。

jQueryには2つのバージョンがダウンロードできます:

  • 圧縮バージョン-ライブサイトに適しています。なぜならそれは縮小および圧縮されているからです。

  • 圧縮されていないバージョン-テストと開発用(圧縮されていない読みやすいコード)

以下からURL以下の2つのバージョンをダウンロードしてください:https : //jquery.com/download/

jQueryファイルをダウンロードした後、それが.jsエクステンションを持っていることに気づきます。なぜならjQueryはJavaScriptライブラリであり、HTMLファイルにjQueryファイルを含めることができますからです。<script>要素を追加するのと同じように、通常のJavaScriptファイルを追加します。

  <head>
  <script src="jquery-3.4.1.min.js"></script>
  </head>

常にカスタムスクリプトの前にjQueryファイルを含めます;そうしないと、jQueryコードがjQuery APIにアクセスしようとすると、それらは利用できなくなります。

CDNに含まれるjQuery

jQueryを自分でダウンロードしてホストするくなかったら、CDN(コンテンツ配信ネットワーク)からそれを含めることができます。

StaticfileとMicrosoftは最新バージョンの内容配信を提供しています。

StaticfileやMicrosoftのjQueryを使用するには、以下のいずれかの方法を使用してください:

Staticfile CDN:
<head>
  <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
</head>
Microsoft CDN:
<head>
  <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"></script>
</head>

jQueryを世界中に配置されたサーバーにホストすることで、CDNはパフォーマンス上の利点を提供します。これにより、ユーザーが同じCDNからjQueryのコピーをすでにダウンロードしている場合、再ダウンロードする必要がありません。

jQuery CDNを使用する利点:

他のサイトにアクセスした際、多くのユーザーはStaticfileまたはMicrosoftからjQueryをダウンロードしています。そのため、あなたのウェブサイトにアクセスした際には、キャッシュからファイルがロードされ、ロード時間が短縮されます。また、多くのCDNはユーザーがファイルをリクエストした場合、最も近いサーバーからファイルを提供することを保証し、これもロード時間を短縮します。