jQueryの紹介

JQuery は、プロトタイプの後のもう 1 つの優れた Javascript ライブラリです。これは、CSS3 およびさまざまなブラウザー (IE 6.0 以降、FF1.5 以降、Safari 2.0 以降、Opera 9.0 以降) と互換性のある軽量の JS ライブラリです。jQuery2.0 以降のバージョンでは、IE6/7/8 ブラウザーはサポートされなくなります。 jQuery を使用すると、ユーザーは HTML (Standard Universal Markup Language に基づくアプリケーション)、イベントをより簡単に処理し、アニメーション効果を実装し、Web サイトに AJAX インタラクションを簡単に提供できるようになります。 jQuery のもう 1 つの大きな利点は、ドキュメントが非常に充実しており、さまざまなアプリケーションが詳細に説明されており、選択できる成熟したプラグインも多数あることです。 jQuery は、ユーザーの HTML ページのコードと HTML コンテンツを分離したままにすることができます。つまり、コマンドを呼び出すために HTML に大量の js を挿入する必要はありません。必要なのは ID を定義することだけです。

jQuery は、複数のブラウザーと互換性のある JavaScript ライブラリです。中心的なコンセプトは、書き込みを減らし、より多くのことを行う (書き込みを減らし、より多くのことを行う) です。 jQuery は、2006 年 1 月にニューヨークのバーキャンプでアメリカ人の John Resig によってリリースされました。jQuery には世界中から多くの JavaScript 専門家が参加し、Dave Methvin が率いるチームによって開発されました。現在、jQuery は最も人気のある JavaScript ライブラリとなり、世界で最もアクセス数の多い Web サイト上位 10,000 の 55% 以上で使用されています。

jQuery は無料のオープンソースであり、MIT ライセンスに基づいてライセンスされています。 jQuery の構文設計により、ドキュメント オブジェクトの操作、DOM 要素の選択、アニメーション効果の作成、イベント処理、Ajax やその他の機能の使用など、開発がより便利になります。さらに、jQuery は開発者がプラグインを作成するための API を提供します。モジュール式の使用により、開発者は強力な静的または動的 Web ページを簡単に開発できます。

jQueryはその名の通り、JavaScriptとQueryのことで、JavaScriptの開発を支援するライブラリです。

歴史

1992 年頃、Nombas という会社が C-minus-minus (Cmm) と呼ばれる組み込みスクリプト言語を開発しました。 Cmm の背後にある考え方はシンプルです。マクロを置き換えるのに十分強力なスクリプト言語でありながら、開発者がすぐに学習できるように C (および C++) によく似た言語です。このスクリプト言語は CEnvi と呼ばれるシェアウェアにバンドルされており、開発者にこの言語の威力を初めて示しました。

Nombas は最終的に Cmm の名前を ScriptEase に変更しました。これは、最後の部分 (mm) がネガティブすぎるように聞こえ、文字 C が「怖い」ためでした。

Netscape Navigator が有名になったとき、Nombas は Web ページに埋め込むことができる CEnvi のバージョンを開発しました。これらの初期の実験は Espresso Pages と呼ばれ、World Wide Web で使用される最初のクライアント側言語を表しました。 Nombas は、そのコンセプトが World Wide Web の重要な基礎となるとは想像もしていませんでした。

インターネット サーフィンの人気が高まるにつれて、クライアント側のスクリプトを開発する必要性が徐々に増加しています。現時点では、Web ページがより大きく複雑になり続けていたにもかかわらず、ほとんどのインターネット ユーザーは 28.8 kbit/s モデム経由でのみネットワークに接続していました。ユーザーをさらに悲惨にするのは、単純なフォームの有効性を検証するだけでも、サーバーとの複数回の往復対話が必要になることです。ユーザーがフォームに記入し、送信ボタンをクリックし、処理が完了するまで 30 秒待った後、必要なフィールドに記入するのを忘れたというメッセージが表示されたと想像してください。

当時技術革新の最前線にあった Netscape は、単純な処理問題を解決するためのクライアントサイドスクリプト言語の開発を真剣に検討し始めました。

当時 Netscape で働いていた Brendan Aich は、1995 年にリリースされる予定だった Netscape Navigator 2.0 用に LiveScript と呼ばれるスクリプト言語の開発を開始しました。当時の目的は、それをブラウザとサーバーで使用することでした (元々は LiveWire と呼ばれていました）。 Netscape と Sun は、LiveScript の実装を時間内に完了しました。

Netscape Navigator 2.0 が正式にリリースされる直前に、Netscape はインターネットの流行語 Java を活用するためにその名前を JavaScript に変更しました。 Netscape の賭けは功を奏し、それ以来 JavaScript はインターネットに不可欠なコンポーネントになりました。

JavaScript 1.0 が非常に成功したため、Netscape は Netscape Navigator 3.0 でバージョン 1.1 をリリースしました。たまたま、当時 Microsoft はブラウザに参入することを決定し、JScript (Netscape との潜在的なライセンス紛争を避けるためにこの名前が付けられました) と呼ばれる JavaScript のクローンを備えた IE 3.0 をリリースしました。 Microsoft の Web ブラウザの世界への参入は悪名をもたらしましたが、それは JavaScript 言語の開発における重要なステップでもありました。

Microsoft の参入後、同時に 3 つの異なるバージョンの JavaScript が存在しました。Netscape Navigator 3.0 の JavaScript、IE の JScript、CEnvi の ScriptEase です。 C や他のプログラミング言語とは異なり、JavaScript にはその構文や機能を統一する標準がありません。これら 3 つの異なるバージョンはこの問題を浮き彫りにしています。業界の懸念が高まるにつれ、この言語の標準化が不可欠であることは明らかです。

jQuery の最初のバージョンがリリースされたのは 2006 年 1 月で、これは 10 年以上前になります (注: この時点は公開時点のものです)。長い時間が経った今でも、そのシンプルかつ柔軟なプログラミング スタイルに人々は一目惚れしてしまいます。この記事では、読者に jQuery についてもっと知ってもらうために、jQuery の開発の歴史を説明します。

jQuery が急速に発展する一方で、一部の大手メーカーもビジネス チャンスに注目しています。 2009 年 9 月、Microsoft と Nokia はオープン ソースの jQuery ライブラリのサポートを正式に発表しました。さらに、Microsoft は Visual Studio ツール セットの一部として jQuery を使用することも発表しました。 jQuery スマート ヒント、コード スニペット、サンプル ドキュメントなどの機能が提供されます。 Microsoft と Nokia は今後も jQuery ユーザー メンバーとなり、その他のメンバーには Google、Intel、IBM、Intuit などが含まれます。
2009 年 1 月に、jQuery バージョン 1.3 がリリースされました。これは、さまざまなブラウザーでの同じタイプの他の JavaScript フレームワークのクエリ速度を総合的に上回る新しいセレクター エンジン Sizzle を使用し、プログラム ライブラリのパフォーマンスも大幅に向上しました。このバージョンの 2 番目の変更は、live() メソッドを提供することです。バージョン 1.3 より前では、今後追加される要素にイベントをバインドするために、 live() メソッドを使用できます。 livequery プラグインを使用する必要がありますが、バージョン 1.3 では、live() メソッドを直接使用できます。 2005 年 8 月、John Resig は Prototype の「Behaviour」ライブラリを改善することを提案し、そのアイデアをブログで公開し、3 つの例を使用してそれを説明しました。

当時の John のアイデアは単純でした。彼は、この構文が既存の JavaScript ライブラリよりも簡潔であることに気づきました。しかし、彼が予想していなかったのは、この記事が公開されるやいなや、業界で幅広い注目を集めたことです。そこで、ジョンはこの問題 (より単純な構文で JavaScript ライブラリを作成すること) について真剣に考え始めましたが、2006 年 1 月 14 日、ジョンは jQuery という名前で独自のライブラリをリリースすると正式に発表しました。その後、jQuery が急速に発展しました。
2006 年 8 月、jQuery の最初の安定バージョンがリリースされ、すでに CSS セレクター、イベント処理、AJAX インタラクションをサポートしています。
2007 年 7 月に、jQuery バージョン 1.1.3 がリリースされました。このマイナー バージョンの変更には、jQuery セレクター エンジンの実行速度の大幅な改善が含まれています。このバージョン以降、jQuery のパフォーマンスは、Prototype、Mootools、Dojo などの同様の JavaScript ライブラリのレベルに達します。同年 9 月に jQuery バージョン 1.2 がリリースされました。このバージョンでは、CSS 構文と比較して冗長になったため、XPath セレクターのサポートが削除されました。このバージョンでは、エフェクトをより柔軟にカスタマイズできるほか、新しい名前空間イベントの助けを借りてプラグインの開発も容易になります。同時に、jQuery UI プロジェクトも開始され、この新しいスイートは、かつては人気があったものの時代遅れになった Interface プラグインの代替プロジェクトとしてリリースされました。 jQuery UI には、事前定義されたウィジェットが多数含まれているほか、高度な要素 (ドラッグ アンド ドロップ、並べ替えなど) を構築するためのツール セットが含まれています。

2010 年 2 月に、jQuery バージョン 1.4.2 がリリースされ、イベント委任に関する 2 つの新しいメソッド、delegate() と undelegate() が追加されました。 delegate() は、1.3.2 の live() メソッドを置き換えるために使用されます。このメソッドは live() よりも便利で、動的にイベントを追加する機能も実現できます。たとえば、ホバーイベントをテーブルの各 TD にバインドします

機能

歴史的バージョン

jQuery 1.0

jQuery 1.1

(2007 年 1 月): このバージョンでは API が大幅に簡素化されています。あまり一般的には使用されない多くのメソッドが組み合わされており、習得して説明する必要があるメソッドの数が減ります。

jQuery 1.1.3

(2007 年 7 月): このマイナー バージョン変更には、jQuery セレクター エンジンの実行速度の大幅な改善が含まれています。このバージョン以降、jQuery のパフォーマンスは、Prototype、Mootools、Dojo などの同様の JavaScript ライブラリのレベルに達します。

jQuery 1.2

(2007 年 9 月): CSS 構文に関して冗長になったため、このバージョンでは XPath セレクターのサポートが削除されました。このバージョンでは、エフェクトのより柔軟なカスタマイズがサポートされ、新しい名前空間イベントによりプラグインの開発が容易になります。

jQuery UI (2007 年 9 月): この新しいプラグイン スイートは、かつては人気があったものの時代遅れになった Interface プラグインの代替プロジェクトとしてリリースされました。 jQuery UI には、事前定義されたウィジェットが多数含まれているほか、ドラッグ アンド ドロップ インターフェイス要素などの高度な要素を構築するためのツール セットも含まれています。

jQuery 1.2.6

(2008 年 5 月): このバージョンは主に、Brandon Aaron によって開発された人気のある Dimensions プラグインの機能をコア ライブラリに移植します。

jQuery 1.3

(2009 年 1 月): このバージョンでは、新しいセレクター エンジン Sizzle が使用され、ライブラリのパフォーマンスが大幅に向上しました。このバージョンでは、イベント委任機能が正式にサポートされています。

jQuery 1.3.2

(2009 年 2 月): このマイナー バージョンのアップグレードにより、ライブラリのパフォーマンスがさらに向上します。たとえば、visible/:hidden セレクター、.height()/.width() の基礎となる処理メソッドの仕組み。さらに、ドキュメントの順序で返される要素のクエリもサポートしています。

jQuery 1.4

(2010 年 1 月 14 日): コード ベースが内部的に書き直されて整理され、いくつかのスタイル仕様が確立され始めました。古い core.js ファイルは、CSS と属性を論理的に分離するために、attribute.js、css.js、data.js、manipulation.js、traversing.js、queue.js に分割されています。

1. Ajax の書き換え

Ajax モジュールが完全に書き換えられました。新しい jXHR オブジェクトが追加され、さまざまなブラウザーで組み込み XMLHttpRequest の一貫したスーパーセットが提供されます。 XMLHttpRequest 以外のトランスポート メカニズム (JSONP リクエストなど) の場合、jXHR オブジェクトも処理できます。 (詳細については、jQuery.ajax ドキュメントを参照してください)

さらに、システムの拡張性が大幅に強化され、さまざまなデータプロセッサ、フィルター、送信メカニズムを接続できるため、新しい Ajax プラグの開発に便利です。 -ins。

2. Deferred オブジェクト

Deferred オブジェクト (Deferred Object、jQuery.Deferred オブジェクト) は、Promise インターフェイスを実装し、コールバック キューに複数のコールバックを登録し、コールバック キューを呼び出し、成功または失敗のステータスを転送できるチェーン可能なユーティリティ オブジェクトです。任意の同期/非同期関数の。 「jQuery 1.5 での遅延の使用」で説明したように、その結​​果、jQuery はタスク (イベント) の結果に依存するロジックをタスク自体から切り離すことができます。実はこれは JavaScript では新しいことではなく、Mochikit と Dojo は以前から実装されていました。 jQuery 1.5 の Ajax モジュールは組み込みの遅延オブジェクトを使用するため、jQuery を通じて作成された Ajax プログラムはこの機能を自動的に取得します。

開発者は、すぐには利用できない戻り値 (非同期 Ajax リクエストの戻り結果など) を使用でき、初めて複数のイベント ハンドラーをアタッチできます。

たとえば、新しい jQuery 内部 Ajax API を使用すると、次のコードを実装できます:

// リクエストを行った直後にハンドラーを割り当て、// このリクエストの jxhr オブジェクトを記憶します var jxhr = $.ajax({ url : "example.php" }) .success(function() {alert("success"); }) .error(function() {alert("error"); }) .complete(function() {alert( " complete"); });// ここで他の作業を実行 ... // 上記のリクエストに対して別の完了関数を設定します jxhr.complete(function(){ alter("2 番目の完了"); });

さらに、 jQuery.Deferred を使用して独自の遅延オブジェクトを開発することもできます。詳細については、遅延オブジェクトのドキュメントを参照してください。

3. jQuery.sub()

jQuery 1.5 は、jQuery のコピーを作成および変更する方法を提供します。これは、外部に公開されないメソッドを追加したり、jQuery の特定のメソッドを再定義して新しい機能を提供したり、より適切なカプセル化を提供して名前空間の競合を回避したりするために使用できます。もちろん、プラグインの開発にも使用できますが、Resig は、プラグインを開発する前に jQuery UI ウィジェット ファクトリを検討することを強くお勧めします。

サブ関数は実際の分離を提供しておらず、すべてのメソッド、データ、呼び出しは依然として jQuery 自体に依存してサポートされていることは注目に値します。

4. トラバーサル パフォーマンスの向上

新しいバージョンでは、.children()、.prev()、.next() などのいくつかの一般的に使用されるトラバーサル関数のパフォーマンスが大幅に向上しました。

5.社内開発体制

John Resig 氏は、jQuery チームの内部開発システムにおける 2 つの変更についても具体的に言及しました。1 つは、サーバー側が古い Java/Rhino システムを Node.js に置き換えたことで、チームは JavaScript 環境の新しい変更に集中できるようになりました。2 番目はコードです。オプティマイザは Google Closure から UglifyJS に切り替わりました。新しいツールの圧縮効果は非常に満足です。

使い方

jQuery は 2 つのバージョンをダウンロードして使用できます

製品バージョン - 実際の Web サイトで使用され、合理化され、圧縮されています。

開発バージョン - テストと開発用 (非圧縮、可読コード)

jQuery バージョン 1.8.0 の圧縮前後の比較

プラグインの仕組み

jQuery の公式プラグインはjQuery UI。開発者は、必要に応じて jQuery の関数ライブラリを任意に拡張したり、UI コンポーネントを開発したりできます。インターネット上にはすでに数万の jQuery プラグインがあり、さまざまなニーズをカバーしています。たとえば、Ajax 支援、データ テーブル、動的リスト、XML ツール、ドラッグ アンド ドロップ、Cookie 処理、ポップアップ レイヤーなどです。 jQuery のドキュメントは非常に充実しており、さまざまなアプリケーションについても詳細に説明されています。また、ASP NET Wijmo 用の ComponentOne Studio など、多くの成熟したプラグインから選択できます。

Web サイトでの jQuery プラグインの使用が増加しています。構築プロセスは常に増加しているため、時代のペースに従い、フロントエンドのユーザー エクスペリエンスを統合および改善し、ユーザー エクスペリエンスを新しいレベルに引き上げるために、いくつかの新しいプラグイン/コード スニペットを開発する必要があります。これらには、Flat jQuery Price Slider、Gmaps jQuery Map Plugin、FormChimp - jQuery 用 MailChimp Ajax プラグインなどが含まれます。

Control

jQuery ガント コントロールは、ネイティブ HTML5/jQuery に基づいた機能豊富なコントロールであり、多くのデバイスやブラウザーでシームレスに実行されます。

プロジェクト ガント チャートの組み込みのスケジュール、依存関係、その他の機能を使用して、タスクの階層リストを視覚化します。

リソース ガント チャートを使用して、リソース使用率ビューを実装します。

API ベースの jQuery または API ベースの MVC を使用すると、ガント チャートを簡単にインストールし、アプリケーションを高速化できます。

KnockOut(KO)、jQuery.tmplなどの一般的なjQueryパターンで使用できます。