jQueryを使う時、最初にすること①【jQuery超入門】

jQueryを使うと、色を変えたり、アニメーションしたり、できます。

例えば
$(‘p’).css(‘color’,’red’);
と書くと、pタグの文字の色が赤くなります。

しかし！その記述をする前にやっておかなければいけないことがあります。

それは、

jQuery本体を読み込んでおくことです。

jQueryはJavaScriptのライブラリです。

JavaScriptの機能が入っているライブラリであるjQuery本体をまずとってきて、HTMLの中で読み込んでおく必要があります。

jQuery本体（ライブラリ）をとってくる

『jQuery本体をまずとってきて、』って、どこから・・・？

安心してください。JQuery公式サイトから、とってくることができます。

2つのやり方があります。

（１）ダウンロード・・・jQueryをダウンロードして使う

（２）CDN・・・jQueryをダウンロードせず、Googleなどのサーバーからとってきて使う。

（＊CDN・・・Content Delivery Network）

①まず、準備としてダウンロードしたjQueryを入れておくjsファイルを作っておきましょう

②jQueryの公式サイト（https://jquery.com/）の、『Download jQuery』をクリックします。

「compresses（圧縮版）」と「uncompresses（非圧縮版）」がありますが、

ダウンロードして使うのは、一番上の

Download the compresses,production jQuery 3.3.1

がいいでしょう。

compressesは圧縮版で、ダウンロードするとファイル名に「mini」がついています（jquery-3.3.1.min.js）。

圧縮している方がサイズが小さいのでおすすめですが、中のコードが見たければuncompressesだと改行などが入っているのでコードが読みやすいです。

Download the uncompresses,development jQuery 3.3.1　←　非圧縮版

Download the compresses,production jQuery 3.3.1 slim build　←　機能限定・圧縮版

Download the uncompresses,development jQuery 3.3.1 slim build　←　機能限定・非圧縮版

＊macでのダウンロードの仕方

ダウンロードするものの上で右クリックし、「リンク先を別名で保存」します。

＜作成したjsファイルに保存しておきましょう！＞

jQueryをダウンロードせず、Googleなどのサーバーから取ってきて使います。

＊CDN(Content Delivery Network)

②jQueryの公式サイト（https://jquery.com/）の、『Download jQuery』をクリックします。ここまでは、ダウンロードする方法と同じです。

②jQueryをダウンロードした少し下に『Other CDNs』という言葉がありますので探してください。

②どれでもいいのですが、例えば『Google CDN』をクリックし、以下の
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js”></script>
のコードをコピペして使います。

J query ready1.key from sayokomiura