jQueryを使用する時にCDNの読み込ませることは必須です。
CDNを誰でも迷わず読み込ませられる方法をご紹介します。
jQueryとは
jQueryとはJavaScriptのライブラリの一つです。
ライブラリとは、プログラムの処理をまとめたものを意味します。
JavaScriptで書くと何行にも及ぶ処理が、jQueryを使用することで短縮して記述することができます。
jQueryを使用すると、JavaScriptの記述が短くて済むと覚えておけば問題ないです。
CDNとは
そもそもCDNについて知らない方も多いかと思いますので解説をしていていきます。
CDN(Contents Delivery Network, CDN)とは、外部のファイルをリンク1つで使用することができる仕組みのことです。
本来なら、ファイルをダウンロードしてという手間がかかりますが、このCDNを使用することでその手間を省くことができます。

CDNを読み込む方法
jQueryのCDNを読み込む方法は、</body>の直前で、jsファイルよりも上(先)に読み込ませましょう!
読み込ませる記述は、以下の記述です。
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
※cssなどと同様に<head></head>の中に記述することを推奨している記事もありますが、読み込まれないトラブルが発生するケースが多いので必ず</body>の直前で、jsファイルよりも上(先)に読み込ませてください!
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery基礎</title>
</head>
<body>
//この部分にCDNの記述をコピペする//
<script src="script.js"></script>
</body>
</html>
CDNの種類
上記では、jQueryの公式から出ているjQueryのCDNを紹介しましたが、他にもjQueryを使用する際に使用できるCDNがありますので紹介していきます。
jQueryのCDN
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
こちらは、先ほどから紹介しているjQueryの公式から出ているjQueryのファイルを読み込ませるためのCDNです。
GoogleのCDN
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
こちらは、Googleから出ているjQueryのファイルを読み込ませるためのCDNです。基本的には、jQueryの公式から出ているものを使用して問題ありません。
MicrosoftのCDN
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.min.js"></script>
こちらは、Microsoftから出ているjQueryのファイルを読み込ませるためのCDNです。Googleと同様に基本的には、jQueryの公式から出ているものを使用して問題ありません。
jQueryの学習方法
jQueryの学習方法は、様々ありますが当ブログでは以下のステップをおすすめしています!
①【これだけ覚えて!】jQueryの書き方
②【jQuery入門】頻出メソッド・文法の基礎を徹底解説します!
③jQueryのイベントを一覧で紹介!シーン別の使い方も解説します!
④【コピペでできる!】jQueryを使用したハンバーガーメニューの作り方
⑤あとは実践あるのみ!デザインカンプから実装してみよう!
コメントを残す