【jQuery】GoogleのCDNから読み込むやり方を解説します

JavaScript

こんにちは。たいら(@tairaengineer2)です。
転職を繰り返し現在4社経験している、11年目エンジニアです。

この記事では、 jQueryをGoogleのCDNから読み込むやり方を解説します。

前提条件:実行環境について

実行環境は以下の通りです。

OS Windows10

jQueryをGoogleのCDNから読み込むやり方を解説

jQueryをGoogleのCDNから読み込むやり方を解説します。

以下のリンクでGoogle Hosted LibrariesのjQueryの項目に行きます。
Google Hosted Libraries
Google Hosted LibrariesのjQuery

読み込むことができるjQueryのバージョンは

  • 1.x
  • 2.x
  • 3.x

があるので、どのバージョンを読み込みたいのかを確認します。
この記事では、【3.x】を読み込みます。
Google Hosted LibrariesのjQuery

読み込むscriptタグはコピーしておきます。

これで読み込む準備はできました。
あとはHTMLにコピーしたscriptタグを埋め込むだけです。
フォルダ構成は以下の画像のようになっている、とします。

【sample_jquery.js】は、jQueryを使いたいJavaScriptです。

読み込むサンプルプログラムは以下になります。

HTMLで外部のJavaScriptを読み込むやり方は、以下の記事をご参考ください。

必ず作成したJavaScriptよりjQueryをに読み込むことが肝心です。
HTMLは最初から順々に読まれます。
作成したJavaScriptが先だとjQueryを使う場所で止まってしまいます。
そのためjQueryを先に読むことが大切です。

まとめ:jQueryをGoogleのCDNから読み込んでみよう

以上がjQueryのGoogleのCDNから読み込むやり方の解説でした!

jQueryを使うやり方はGoogleのCDNから読み込むだけでなく、ダウンロードして読み込むやり方もあります。
詳しくはこちらの記事をご参考ください。

あなたのご参考になったのなら、とても嬉しいです(*´▽`*)
ではでは~(・ω・)ノシ

コメント

タイトルとURLをコピーしました