jQuery ライブラリ

作成日:2013-04-04
最終更新日:

オライリーの JavaScript 第6版 を図書館から借りて、 いろいろ調べている。 19 章のjQuery ライブラリは知らないので、少し調べてみた。

概要

jQuery とは、JavaScript のライブラリである。 ライブラリを使う目的は、複数のブラウザに対応したり、処理を簡単に書いたりすることである。 JavaScript にはいくつものライブラリがあるが、 そのなかで jQuery がもっともひろく知られているのでこの本でも取り上げられている。

導入方法

jQuery は http://jquery.com からダウンロードできる。 実際に使うには、ダウンロードしたライブラリをローカルコンピュータで使うか、 Google などにあるインターネット上のライブラリ(Contents Delivery Network, CDN)をリンクするかである。 以前はダウンロードしたライブラリを使っていたが、2020-10-10 からは Microsoft の CDN を使うことにした。

2013-05-03 現在、バージョンは 1.9.1 であったが、 2020-10-10 現在、バージョンは 3.5.1 である。

基本

いくつか例があるが、イベントとの関連でわかりやすい例を出す。

1. この段落にある文章をクリックすると、下の文書が上昇して段落が消える。消えた後リロードすれば元に戻る。

2. 右のボタンをクリックすると、段落の文字色が赤く変わる。リロードするともとに戻る。

jQuery 関数

上記を例として、実際に HTML を処理しているのが jQuery()関数である。別名が $() であり、こちらが短いことからよく使われる。 この関数には4種類の使い方がある。言い換えれば $()の第1引数としてわたすオブジェクトには4種類ある。

  1. 引数に CSS セレクタとしての文字列をわたす
  2. 引数に (Element|Document|Window) オブジェクトをわたす
  3. 引数に HTML テキスト文字列をわたす
  4. 引数に 関数をわたす

かのように雑食性である。引数を適用した(食べた)結果はオブジェクトとなり、 適切なメソッドを適用することで参照や更新を適切に行うことができる。

問と答

問い合わせを行った結果を保存し、その結果をプロパティで見る。

上記をクリックすると、それぞれ、"script", document.body, "1.9.1" が出てくると本には書いてある。 jQuery 1.9.1 では、実際に第2番めの例では [object HTML Bodyelement] という表示になっている。 表示としては当然だろう。 jQuery 3.5.1 ではそれぞれ、"undefined", "undefined", "3.5.1" だった。 実装が変わったのだろうが、あまり直す気が起こらない(2020-10-10)

まりんきょ学問所JavaScript 手習い > jQuery ライブラリ


MARUYAMA Satosi