jQuery

出典: フリー百科事典『ウィキペディア(Wikipedia)』
移動: 案内, 検索
jQuery
開発元 jQueryチーム
初版 2006年8月26日(5年前) (2006-08-26
最新版 1.7.1(2011年11月21日(2か月前) (2011-11-21
プログラミング言語 JavaScript
サポート状況 開発中
種別 Webアプリケーションフレームワーク
ライセンス デュアルライセンス:
GPLMIT
公式サイト jquery.com
テンプレートを表示

jQuery(ジェイクエリー)は、JavaScriptHTMLの相互作用を強化する軽量なJavaScriptライブラリジョン・レシグが2006年1月に開催された BarCamp NYC でリリースした。MIT LicenseGNU General Public Licenseデュアルライセンスであり、フリーかつオープンソースである。

目次

[編集] 機能・特徴

jQueryには次のような機能・特徴がある。

  • ブラウザに依存しないオープンソースのセレクタエンジン Sizzle を使ったDOMエレメントの選択(Sizzle は jQuery プロジェクトからスピンアウト)[1]
  • DOM操作と変更(CSS 1-3 と基本的なXPathのサポートを含む)
  • イベント
  • CSS操作
  • エフェクトとアニメーション
  • Ajax
  • ユーティリティ - ブラウザのバージョン取得、each関数など
  • 拡張性 - jQuery プラグイン

[編集] $関数

jQueryのコードで重要なコンセプトの1つは、いわゆる '$' 関数である。'$' は実際には 'jQuery' 名前空間での別名 (alias) である。

例 1: jQuery は文字列のトリミングのための関数を提供している。この関数は次のように使用できる。

str = "    foo     ";
jQuery.trim(str); // "foo" を返す

あるいは、次のように使うこともできる。

str = "    foo     ";
$.trim(str);

これらは等価である。'$' を 'jQuery' の代わりに使うことはアドホックな規約であり、jQueryライブラリへの手っ取り早いアクセス法と見なすことができる。

例 2: クラス 'foo' を持つ全てのパラグラフを選択し、別のクラス 'bar' をそれら全てに追加する。

$("p.foo").addClass("bar");

例 3: ページのDOM木が構築された直後に関数 'myfunc' を実行する(jQueryの用語では ready handler と呼ぶ)。

$(function() {
    myfunc();
});

これは例えば次のような形で使用する。

$(function() {
  // CSSクラス oddStripe と evenStripe を使って文書内の全テーブルをストライプにする。
  $('tr:odd').addClass("oddStripe");
  $('tr:even').addClass("evenStripe");
});

[編集] ロード方法

jQueryは通常単一のJavaScriptファイルとして存在し、その中に全ての共通DOM、イベント、エフェクト、Ajax関数が含まれている。次のようなマークアップを使って、任意のWebページにこれを含めることができる。

<script type="text/javascript" src="/path/to/jQuery.js"></script>

jQueryの最新安定版は、Google、Microsoft、EdgeCastなどの運用するCDNを使ってロードすることもできる。この方法では、Web上での広汎な利用におけるレイテンシの改善といったCDNの利点を享受でき、自身でコピーをホストする必要も無くなる。

CDNからのロード方法は次のように、単にCDN上のURLを指定すればよい。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>

また、Google AJAX Libraries APIでは次のような記述も利用できる[2]

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.6");</script>

[編集] 使用法

jQueryには2種類のインタラクションがある。

  • jQueryオブジェクトのファクトリメソッドである $ 関数を使う。これらの関数は「コマンド」とも呼ばれ、連鎖可能であり、それぞれがjQueryオブジェクトを返す。
  • $.をプレフィックスとする関数を使う。これらは「ユーティリティ関数」であり、本来jQueryオブジェクト上で動作しない。

複数のDOMノードの操作をする典型的ワークフローは、まず $ 関数をCSSセレクタ文字列を伴って呼び出し、HTMLページ内の0個以上のエレメントを参照するjQueryオブジェクトを返す。このノード群はjQueryオブジェクトまたはノード群自体にインスタンスメソッドを適用することで操作できる。例えば、

$("div.test").add("p.quote").addClass("blue").slideDown("slow");

このコードは、divタグのクラス属性がtestのものとpタグのクラス属性がquoteのもの全てについて、クラス属性blueを追加し、それらをアニメーション付きでスライドダウンさせる。$およびadd関数は一致する集合を決め、addClassslideDownは参照しているノード群に作用する。

$.が前置されたメソッドは簡便なメソッドだったり、グローバルな属性や振る舞いに影響を与える。例えば、次の例はjQueryにおける高階関数であるeachを使っている。

$.each([1,2,3], function() {
  document.write(this + 1);
});

この場合、文書に 234 を書く。

$.ajaxとリモートデータのロードと操作に対応するメソッドを使ってAjaxルーチンを実行することもできる。

$.ajax({
  type: "POST",
  url: "some.php",
  data: {name: "John", location: "Boston"},
  success: function(msg){
    alert( "Data Saved: " + msg );
  }
});

このコードはsome.phpにパラメータ name=John&location=Boston をつけて要求し、その要求が正常に完了したとき、レスポンスを表示する。

[編集] 採用

マイクロソフトノキアはそれぞれ自社プラットフォームへのjQueryバンドルを計画していると発表した[3]。マイクロソフトは手始めに Visual Studio で採用[4]、ASP.NET開発チームをフルタイムでjQueryの開発に参加のうえ、jQueryを同社のASP.NETにおけるクライアント・サイド・スクリプティングの標準として採用し、同社が開発していた類似技術を全て廃止すると発表、ASP.NET AJAX および ASP.NET MVC Framework で利用する。一方ノキアは同社の Web Runtime プラットフォームに組み込む予定である。

[編集] リリース履歴

リリース日付 バージョン番号 備考
2011年11月21日 1.7.1
2011年11月3日 1.7
2011年9月12日 1.6.4
2011年9月1日 1.6.3
2011年6月30日 1.6.2
2011年5月12日 1.6.1
2011年5月3日 1.6
2011年3月31日 1.5.2
2011年2月23日 1.5.1
2011年1月31日 1.5.0
2010年11月11日 1.4.4
2010年10月14日 1.4.3
2010年2月19日 1.4.2
2010年1月25日 1.4.1
2010年1月14日 1.4
2009年2月20日 1.3.2
2009年1月21日 1.3.1
2009年1月14日 1.3 Sizzle Selector Engine がコアに導入された。
2008年5月24日 1.2.6
2008年5月21日 1.2.5 1.2.4 でのビルドミスを修正
2008年5月19日 1.2.4
2008年2月8日 1.2.3
2008年1月15日 1.2.2
2007年9月16日 1.2.1
2007年9月10日 1.2
2007年8月24日 1.1.4
2007年7月5日 1.1.3.1
2007年7月1日 1.1.3
2007年5月20日 1.1.3a α版
2007年2月27日 1.1.2
2007年1月22日 1.1.1
2007年1月14日 1.1
2007年1月8日 1.1a α版
2006年12月12日 1.0.4 1.0 の最後のバグフィックス
2006年10月27日 1.0.3
2006年10月9日 1.0.2
2006年8月31日 1.0.1
2006年8月26日 1.0 最初の安定版
2006年6月30日 1.0a α版

[編集] 関連項目

[編集] 脚注・出典

  1. ^ Resig, John (2009年1月14日). “jQuery 1.3 and the jQuery Foundation”. jQuery Blog. 2009年5月4日閲覧。
  2. ^ デベロッパーガイド AJAX Libraries API、Google
  3. ^ Resig, John (2008年9月28日). “jQuery, Microsoft, and Nokia”. jQuery Blog. jQuery. 2009年1月29日閲覧。
  4. ^ Guthrie, Scott (2008年9月28日). “jQuery and Microsoft”. ScottGu's Blog. 2009年1月29日閲覧。

[編集] 参考文献

[編集] 外部リンク

個人用ツール
名前空間
変種
操作
案内
ヘルプ
ツールボックス
他の言語