読者です 読者をやめる 読者になる 読者になる

jQuery基礎

jQueryとは?

 JavaScriptを使うより簡単な記述で済むように開発されたJavaScriptのライブラリーのことです。

jQueryを使うメリット

  • 簡潔な短い記述で済む。
  • ブラウザ間の差異を吸収する。
  • ネット上に多くの情報が公開されている。

jQueryを使うデメリット

  • サイト全体のパフォーマンス低下につながる。
  • バージョン管理が難しい。

*PCでは使ってスマホでは使わないようにする手法もあります。

jQueryライブラリの使い方

ダウンロードとCDNとして使う二つの方法がありますが、まずはjQueryのバージョンについて確認しておきます。

jQueryのバージョン

1.x系 IE8以前の古いブラウザーに対応

2.x系 IE8以前の古いブラウザー対応を切り捨て身軽にした

3.x系 一番軽い

ダウンロードして使う

<title></title>以下にダウンロードしたjQueryを記述します。

そのすぐ下に<script></script>を記述してソースを記述します。

compressed:改行などを除去してファイルサイズを少なくした。

uncompressed:構造が見易い。圧縮前のファイル。

ダウンロードして使う場合の記述例

<title>jQuery基礎</title>
<script src="../js/jquery-2.2.4.min.js"></script>
<script>
//jQueryコードを記述
</script>

CDNを利用する

CDN(Contents Delivery Network)とは、ファイルや画像といったWebコンテンツをインターネット経由で配信するために最適化されたネットワークのことです。

バージョン管理がし易いという利点があります

メジャーなCDNは以下2つです。

jQuery CDN

google CDN

developers.google.com 

CDNを使う場合の記述例

<title>jQuery基礎</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script>
//jQueryコードを記述
</script>