オフラインでも利用できる！jQueryをダウンロードする方法【初心者向け】
プログラミング初心者向けに、JavaScriptライブラリのjQueryをダウンロードする方法を紹介しています。jQueryをダウンロードしてhtmlに読み込めばオフラインでも利用することができるので、ぜひご覧ください。
テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査
JavaScriptのライブラリであるjQueryを使用するためには二通りの方法があります。
一つはCDN(Contents Delivery Network)を使用する方法、もう一つはjQueryをダウンロードしてそれをHTML内で読み込む方法です。
CDNは一行でjQueryを使用することができますが、サーバーからjQueryをダウンロードするため、オフラインでは使用できないという欠点があります。
そこで今回はオフラインでもjQueryを使用するためにjQueryをダウンロードして使用する方法を解説していきたいと思います。
jQueryについてそもそもよく分からないという方は、jQueryとは何なのか解説した記事をまずご覧ください。
なお本記事は、オンラインブートキャンプ フロントエンドコース（JavaScript・jQuery講座）の内容をもとにしています。
今回の記事の内容は動画でもご覧いただけます。
テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。
オンライン上からjQueryのファイルを読み込んで使用するより、ファイルをダウンロードして、自分のPC上から読み込ませたいんですが。
オフラインでも使用できるので、それもいいね！配布しているサイトがあるので、そこからダウンロードするだけだよ。
さっそくダウンロードしてみます。
jQuery本体のダウンロード
jQuery本体はjQueryの公式ホームページからダウンロードすることができます。
こちらのページにある最新版のjQueryをダンロードしてください。
production、developmentの二種類のリンクがあると思いますが、事情がない限りはproductionの方のファイルをダウンロードしましょう。
なぜなら、developmentの場合、非圧縮ファイルがダウンロードされるため、処理が重くなってしまう可能性があるからです。
HTMLファイルでjQueryを読み込む
ダウンロードをした後は、作業するHTMLと同じフォルダにjQueryのファイルを置いてください。
jQueryのファイルの読み込みはCSSのファイルの読み込みとすこし似ています。
<script src="jquery-3.1.0.min.js"></script>
2016年8月時点での最新版のjQueryが3.1.0のため上のようなコードになっていますが、自分が使用するバージョンに合わせて名前を変えるようにしてください。
まとめ
今回はCDNを使用せずにjQueryをダウンロードする方法について解説していきました。ダウンロードで動かすことのメリットとしては、jQueryをオフラインで使用できるということが挙げられます。
しかし、一般的にCDNで読み込んだ方が処理は早いので、オンライン上のみ使われるページの場合CDNを利用して書くようにしましょう。
jQueryは、CDNからでもファイルを設置してからでも読みこんで使用することが出来るんですね。どちらがいいでしょうか？
例えば自分で借りているサーバーにアクセス出来なくなった場合、jQueryも動作しないので、ファイルを設置するほうでも問題ないかな。
最初のうちは、ファイルを設置して書いてみます！
[お知らせ]TechAcademyでは最短4週間でフロントエンドの技術が身につくフロントエンドオンラインブートキャンプを開催しています。jQueryを使ってリッチなWebサービスを作りたい方はぜひご覧ください。
プログラミングを独学で学習していて、このように感じた経験はないでしょうか？
- ・調べてもほしい情報が見つからない
- ・独学のスキルが実際の業務で通用するのか不安
- ・目標への学習プランがわからず、迷子になりそう
テックアカデミーでは、このような
学習に不安を抱えている方へ、マンツーマンで相談できる機会を無料で提供
しています。
30分間、オンラインでどんなことでも質問し放題です。
「受けてよかった」と感じていただけるよう
カウンセラーやエンジニア・デザイナー
があなたの相談に真摯に向き合います。
「自分に合っているか診断してほしい」
「漠然としているが話を聞いてみたい」
こんなささいな悩みでも大丈夫です。
無理な勧誘は一切ありません
ので、まずはお気軽にご参加ください。
※体験用のカリキュラムも無料で配布いたします。（1週間限定）
