JQuery

jQuery（ジェイクエリー）は、ウェブブラウザ用のJavaScriptコードをより容易に記述できるようにするために設計されたJavaScriptライブラリである。ジョン・レシグが、2006年1月に開催された BarCamp NYC でリリースした。様々な場面で活用されており、JavaScriptライブラリのデファクトスタンダードと呼ぶ者もいる。ロゴの下に表記されているキャッチコピーは「write less, do more」（「少ない記述で、もっと多くのことをする」の意）。 jQueryには次のような機能・特徴がある。 ブラウザに依存しないオープンソースのセレクタエンジン Sizzle を使ったDOMエレメントの選択（Sizzle は jQuery プロジェクトからスピンアウト） DOM操作と変更（CSS 1-3 と基本的なXPathのサポートを含む） イベント CSS操作 エフェクトとアニメーション Ajax ユーティリティ - ブラウザのバージョン取得、each関数など プラグインによる拡張性 通常jQueryは単一のJavaScriptファイルとして存在している。このほかパッケージ管理システム（npm、Yarn、Bower（ドイツ語版））やコンテンツデリバリネットワーク（CDN）（Google、マイクロソフトなど）で配信されている。 ライブラリにリンクする例（同一ホスト・サーバーから）： <script src="jquery-3.7.1.min.js"></script> 公式のパブリックCDN、code.jquery.comを利用する例： <script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script> jQueryは、静的メソッドとjQueryオブジェクトメソッドの2種類あり、それぞれに独自の使用スタイルがある。 jQuery - メインのjQueryオブジェクト $ - jQueryの別名（エイリアス） なおjQueryによって再代入された$変数は、jQuery.noConflict()を記載した行以降、放棄される。これにより他のライブラリなどで宣言されていた$変数を復帰することができる。 jQueryをスタートするには次の方法が推奨されている。 function example() { // 定義された関数による任意のコード } $(example); // または $(function () { // 無名関数による任意のコード }); HTMLの解析を終えると、$()メソッドで指定された関数をコールバックし、DOM操作などを安全にスタートさせる。同じ働きをしていたレディイベント$(document).on('ready', callback)は古典的な方法で、jQuery 3.0以降削除されて、動作しない。 $()メソッドは基本的にjQueryオブジェクトが返る為、次のようにメソッドをつなげていくことが可能である。 $('div.test').add('p.quote').addClass('blue').slideDown('slow'); このコードは、divタグのクラス属性がtestのものとpタグのクラス属性がquoteのもの全てについて、クラス属性blueを追加し、それらをアニメーション付きでスライドダウンさせる。$()変数およびadd()関数は一致する集合を決め、addClass()とslideDown()は参照しているノード群に作用する。 静的メソッドの$.ajax()を用いて非同期通信を実行することができる。$.ajax()の返り値にはPromiseインタフェースを実装したDeferredオブジェクトが返るため、then()メソッドを用いて要求した結果を受けとる必要がある。 $.ajax({ type: 'POST', url: '/process/submit.php', data: { name : 'John', location : 'Boston', }, }).then(function(msg) { alert('Data Saved: ' + msg); }).catch(function(xmlHttpRequest, statusText, errorThrown) { alert( 'Your form submission failed.\n\n' + 'XML Http Request: ' + JSON.stringify(xmlHttpRequest) + ',\nStatus Text: ' + statusText + ',\nError Thrown: ' + errorThrown); }); このコードは/process/submit.phpにパラメータ name=John&location=Boston をつけて要求し、その要求が正常に完了したとき、レスポンスを表示する。 jQuery 3.0以前では結果を受けとる際にsuccess、error、completeの各メソッドに指定されたコールバック関数へ渡していたが、以降削除、動作しない。 Fetch APIと似た文法であるが、jQueryではXMLHttpRequestオブジェクトを利用している為、返されるオブジェクトや、HTTPステータスコードが404でもエラーとは見なさないなど取り扱いが少し異なる。 マイクロソフトとノキアはそれぞれ自社プラットフォームへのjQueryバンドルを計画していると発表した。マイクロソフトは手始めに Visual Studio で採用、ASP.NET開発チームをフルタイムでjQueryの開発に参加のうえ、jQueryを同社のASP.NETにおけるクライアント・サイド・スクリプティングの標準として採用し、同社が開発していた類似技術を全て廃止すると発表、ASP.NET AJAX および ASP.NET MVC Framework で利用する。一方ノキアは同社の Web Runtime プラットフォームに組み込む予定である。 主なリリースを示す。下に行くほど古いバージョンを示している。 Ajax AngularJS Backbone.js KnockoutJS MooTools MontageJS Prototype JavaScript Framework Raphael (JavaScriptライブラリ) Vue.js WinJS [脚注の使い方] ^ バージョン1.8以降からシングルライセンス化。1.7.2まではMIT LicenseとGNU GPLバージョン2のデュアルライセンス。 ^ “jQuery Mobileページの基本構造を理解しよう”. ＠IT. 2012年10月5日閲覧。 ^ Resig, John (2009年1月14日). “jQuery 1.3 and the jQuery Foundation”. jQuery Blog. 2009年5月4日閲覧。 ^ “Downloading jQuery” (英語). 2024年8月19日閲覧。 ^ “jQuery.noConflict()” (英語). 2021年4月26日閲覧。 ^ “jQuery Core 3.0 Upgrade Guide #Deprecated: document-ready handlers other than jQuery(function)” (英語). 2021年4月26日閲覧。 ^ “Promise”. MDN. Mozilla. 2021年4月26日閲覧。 ^ “jQuery Core 3.0 Upgrade Guide #Ajax” (英語). 2021年4月26日閲覧。 ^ “Fetch API #jQueryとの違い”. MDN. Mozilla. 2021年4月26日閲覧。 ^ Resig, John (2008年9月28日). “jQuery, Microsoft, and Nokia”. jQuery Blog. jQuery. 2009年1月29日閲覧。 ^ Guthrie, Scott (2008年9月28日). “jQuery and Microsoft”. ScottGu's Blog. 2009年1月29日閲覧。 Chaffer, Jonathon; Karl Swedberg (2007). Learning jQuery: Better Interaction Design and Web Development with Simple JavaScript Techniques. Packt Publishing. ISBN 978-1847192509  Bibeault, Bear; Yehuda Katz (2008). jQuery in Action. Manning Publications Co.. ISBN 978-1933988351  Heilmann, Christian (2006). Beginning JavaScript with DOM Scripting and Ajax. Apress. ISBN 978-1590596807. https://books.google.co.jp/books?id=M3Uqna8RIAkC&redir_esc=y&hl=ja 2009年5月4日閲覧。  Darie, Cristian; Filip Chereches-Tosa, Mihai Bucicia (2005). AJAX and PHP: Building Responsive Web Applications. Packt Publishing. ISBN 978-1904811824  Heilmann, Christian; Mark Norman Francis (2007). Web Development Solutions. Apress. ISBN 978-1590598061. https://books.google.co.jp/books?id=AdEfkbOmmX4C&redir_esc=y&hl=ja 2009年5月4日閲覧。  Taft, Darryl K. (2006年8月30日). “jQuery Eases JavaScript, AJAX Development”. eWeek. 2009年5月4日閲覧。 Krill, Paul (2006年8月31日). “JavaScript, .Net developers aided in separate projects”. InfoWorld. 2009年5月4日閲覧。 公式ウェブサイト jQuery プラグイン