見出し画像

[Blogger]番外編その1 jQueryどれが正解?

なんか、機能を足そうとしてスクリプトに書き込まれてるのが、jQuery。スクリプトをコピペしたら動くけど、あれこれコピペするだけだと、複数のjQuery書き込まれてたりしちゃうかも。

複数書いてあっても、動くと言えば、動く。

で、あちこちのサイトで書き方も多数で、どの形がいいんだろう?
あと書かれたサイトの時期によって、バージョンも違う。最新はどれで、どこに行けば最新版のバージョンを知ることができるのだろうか?
とりあえず、見つけた書き方一覧

<script type="text/javascript" src="jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.5.1.min.js"></script>
<script async='async' src='//cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js'/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> 

ダウンロードできない環境で使うために埋め込む方法なんかもあるし、圧縮版のMinified、非圧縮版のUncompressedなど、ほんとに多岐にわたる。min って書かれた部分が無駄を削った最小版の意味

上記の書き方のうち、ネット上のjQueryにリンクを貼って使用する方法が、ajax。。。ってやつ。
CDN(Contents Delivery Network)で配信されているjQueryにリンクを貼ればjQueryファイルをダウンロードしなくても直接jQueryを使うことができるようになるとのこと。

本体をダウンロードするなら、ここでした。

CDNとやらでは、Googleの他、マイクロソフトもありますね。

まあ、Google Blogger で使うし、Googleをつかっときましょうかね。Version は1系、2系、3系との違いがあるようですが、よくわからないので、ひとまず3系の最新、3.5.1で搭載しておきます。

あと、asyncってのがありますよね。これは、非同期読み込みっぽいですね。
ググると、async, defer という使い方の解説がありました。広告入れたりすると、遅くなるみたいなので、この使い方をマスターしておいたほうがよいかもしれません。解説サイトは、こちら。

最終は、これで決定。

<script async='async' src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

いいなと思ったら応援しよう!