ホームページ >ウェブフロントエンド >jsチュートリアル >jquery とプロトタイプ Framework_jquery の詳細な比較

jquery とプロトタイプ Framework_jquery の詳細な比較

WBOY
WBOYオリジナル
2016-05-16 17:13:25859ブラウズ

以前は jquery を使用してインターフェイスを作成していましたが、現在は Ajax エフェクトを多用する必要があるため、Rails に付属するプロトタイプに切り替えました

jqueryはよく使われるので、他のフレームワークと似ていますが、細かい部分では違う部分も多くあります。 。 。

1.dom ロード:

Jquery には、dom ツリーが完了するまで js 関数のバインドを延期する dom read メソッドがあります (この関数がないと、一部の要素イベント関数などのバインドが失敗する可能性があります)。

$(document).ready(function(){});

しかし、プロトタイプはありません。 。 。非公式の拡張機能を自分で探す必要があり、これほど重要な基本機能がなぜ長い間コア ライブラリに追加されなかったのかわかりません。

2.パス検索、DOM の位置決め

JQuery の DOM 検索は CSS の配置と一致しており、使用すると非常に便利に感じます。これは JQuery のハイライトであり利点の 1 つです。

$('.func #select_all').click(function()
$(this).parent('div').parent('div').find('li .checkbox input:checkbox' )

プロトタイプは、単一の DOM オブジェクト -- $(id) を見つける場合にのみ便利です

さらに面倒なのは、パスの下に多数のオブジェクトが見つかった場合に、個別と配列を分離することです。

$$('div .right_contact') を取得します。このスタイルは依然として特定の種類のオブジェクトを配置します

パス検索を使用する代わりに、この側面は jquery ほど便利ではなく、一貫性もありません

3. 関数、イベント バインディング
たとえば、クラス right_contact を持つ div にクリック ハイライト イベントをバインドします。プロトタイプは次のように記述されます。 >

$$('div .right_contact').each(function( item) {
item.observe('click', function(event){
new Effect.Highlight(item,{duration: 2.0,startcolor: '#ffff99',endcolor: '#ffffffff',restorecolor: '# fffffff' });
});
jquery の場合は、はるかに簡単です:

$('.right_contact').click(function(){
$(this).toggleClass('hilight');
})

私は多くのフレームワークを使用しましたが、最も印象的なのは hge ゲーム エンジンと呼ばれるフレームワークで、これには多くの基礎的な詳細と実装メソッドがカプセル化されています。そして彼はこう言いました。単純なパズルから高度な多層プラットフォーマーまで、あらゆるものを作成できます。ゲームロジック以外のコードを考えずに戦略を立てる

優れたフレームワークは、設計パターンの観点からは、プロトタイプよりもビジネス ロジックに重点を置く必要があります。最も典型的な例は、マウスのクリックで関数をトリガーする場合は、プロトタイプを大きくする必要があります。監視メソッドで、クリックイベント
を登録し、jquery には item.click 関数があります。 。 。 Observe は包括的ですが、最も一般的に使用されるイベントに専用の関数を作成するという jquery の実践により、ユーザーはビジネス ロジックにより集中できるようになります。 。 。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。