jQueryの読み込み方法

ロッチくくん

jQueryの読み込み方法を知りたいニャ

jQueryを読み込むにはダウンロードしてサーバーにアップロードする方法とCDNで読みこむ方法とありますが、ここでは手軽にすぐ読み込めるCDNを使った方法を紹介します。

はじめに
最後に

はじめに

まずはCDNの解説から

CDN（Contents Delivery Network）とは、数多くのキャッシュサーバーなどで構成されたプラットフォームを用いることにより、Webサイト上のコンテンツを迅速にエンドユーザーに届けるための仕組みです。
ICT Business Online「CDNとは」より

最初はよくわからないと思いますが、ようするに読み込むファイルをダウンロードしなくてもURLでどこかのサーバーから読み込むというお手軽な手法です。

jQueryのCDNはjQueryの公式かGoogleが提供してるものを選ぶとよいでしょう。

jQueryの公式サイトのCDN

Googleが提供してるCDN

とりあえず、ソースファイルのコメントや改行などを排除していて容量が少なく軽量で高速な「minified」を選んで、HTMLファイルの</body>タグの前に読み込みましょう。

自作のJSより前に読み込むことを忘れずに！

<body>
    

    <script src="https://code.jquery.com/jquery-3.7.0.min.js"
        integrity="sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g=" crossorigin="anonymous"></script>
    <script src="main.js"></script>
</body>

</html>

最後に

以上でjQueryの読み込みは完了しました！

あとは数行自作のjsを書いてで使える便利なUIパーツが沢山ありますので、これから紹介する様々な動きを一緒に学習していきましょう。

jQueryでできる簡単なUIパーツの実装方法はこちらからご覧ください！