Jquery使用概要

JQueryは、Web開発を行ったプログラマー一人一人がよく知っていると信じています.Prototypeに続いて優れたJavascriptフレームワークです.JSを直接使用するよりも互換性が高いからです(軽量級のjsライブラリです.これは他のjsライブラリには及ばないです.CSS 3にも互換性があり、さまざまな一般的なブラウザにも互換性があります).だからますます多くの人がwebプロジェクトを開発する時すべてJQueryの関連ファイルを導入して、つまりいくつかの特効を使うことができないで私達もやはりそれを導入したいと思っています(その宗旨:WRITE LESS、DO MORE、もっと少ないコードを書いて、もっと多くのことをします)、それは私にJSよりもっと良い互換性を提供することができるだけではなくて、その上いくつかの操作をパッケージしました.ユーザーがHTML documents、eventsをより容易に処理し、アニメーション効果を実現し、ウェブサイトにAJAXインタラクションを容易に提供できるようにするため、web開発ではJQueryの使用を推奨しています.JQuery-UIなど、より高度なパッケージを作ると、ポップアップウィンドウがより美しくなり、操作も簡単になります.私たちがよく使うJQueryの特性を、普段使っている資料やネット上の資料に基づいてまとめてみました.
1、まずJQueryのコアライブラリを導入する必要がある
JQueryコアjsファイルも数十kbで、ページのロード速度にはほとんど影響しません.

<script type="text/javascript" src="${ctx}/js/jquery-1.9.1.min.js"></script>

2、セレクタ機能
JQueryのセレクタは便利です.例えば、domオブジェクトの隣接する要素jsを見つけるには数行のコードを書く必要がありますが、JQueryの1行のコードで終わります.例えば、1つのテーブルの間隔を変色するには、JQueryも1行のコードで終わります.次に例を示します.

<script type="text/javascript">
		//    
	$(document).ready(function(){
			
		$(".stripe_tb tr").mouseover(function(){ //      class stripe_tb    tr  ，    
		$(this).addClass("over");}).mouseout(function(){ //     class  over，              
		$(this).removeClass("over");}) //     class
		$(".stripe_tb tr:even").addClass("alt"); // class stripe_tb         class  alt
			
	});
</script>

/*          */
.stripe_tb tr.alt td{background:#ecf6fc} /*              */
.stripe_tb tr.over td{background:#FEF3D1} /*             

3、クロスブラウザ互換JQueryは現在主流のブラウザと基本的に互換性があり、ブラウザの互換性の問題に頭を悩ませる必要はありません.
4、Ajax操作サポート
JQueryはAJAX操作を簡略化し、バックグラウンドではJSON形式の文字列を返すだけでフロントとの通信が完了します.もちろん、divまたはiframeと組み合わせて、1つのページに戻る非同期リフレッシュ機能を完了することもできます.次の接続は、私が書いたJquery+divが非同期リフレッシュを実現する例です.
http://blog.csdn.net/huangaigang6688/article/details/17038579
5、イベント、スタイル、アニメーションのサポート
JQueryはまたjs操作cssのコードを簡略化し,コードの可読性もjsより強い.以下に、Jqueryが実装するいくつかのダイナミックな効果を示します.

//1、        ：
$(document).ready(function(){
    $('div').click(function(){
        $(this).effect('explode');
    });
});

//2、        
$(document).ready(function(){
    $('img').animate({top: '+=100px'},1000);
});

//3、           
$(document).ready(function(){
    $('div').click(function(){
        $(this).effect('bounce', {times:3}, 500);
    });
});

//4、         
$(document).ready(function(){
    $('div').click(function(){
        $(this).effect('slide');
    });
});

//5、        
$(document).ready(function(){
    $('ol').sortable();
});

//6、          
$(document).ready(function(){
    $('#menu').accordion();
});

6、チェーン操作
JQueryのチェーン操作は、複数の操作を1行のコードに書くことができ、より簡潔になります.
Web要素を選択すると、その要素を操作できます.jQueryでは、すべての操作を接続し、チェーン形式で書くことができます.これはjQueryの最も称賛され、最も便利な特徴です.その原理は、各ステップのjQuery操作であり、返されるのはjQueryオブジェクトであるため、異なる操作を接続することができる.

 $('div').find('h3').eq(2).html('Hello'); 

7、拡張性が高い
JQueryには、ツリーメニュー、日付コントロール、ピクチャ切り替えプラグイン、ポップアップウィンドウなど、基本的なフロントページのコンポーネントに対応するプラグインが豊富で、JQueryプラグインで作られた効果が高く、必要に応じてプラグインを書き換えたりカプセル化したりすることができ、簡単で実用的です(Jquery-UI).JQueryは拡張インタフェースを提供しています:JQuery.extend(object)は、JQueryのネーミングスペースに新しい関数を追加できます.JQueryのすべてのプラグインはこの拡張インタフェースに基づいて開発された.
総括:実はもっと多くの特性を理解したいのはやはり直接公式のドキュメントを参考にして、上で言ったのはとても全面的で、もちろん私达もすべて记忆する必要はありませんて、どんな効果を使って直接调べて、私达がふだん多く见ていない限り、どんな効果があるか知っていればokです.
JQueryはスクリプトとページの分離を実現し、ラベルidさえあればCSSがスタイルコードとページコードを分離するように、さまざまな効果を追加することができ、柔軟性の高い明確なページコードを実現することができます.もちろんJQueryにもいくつかの欠点があります.例えば、後方互換性がなく、複数のプラグインが衝突したり、異なるライブラリを導入したりする前後の順序などですが、これらはそれがもたらす便利さよりも価値がありません.絶えず最適化されていると信じています.今後、その欠点はますます少なくなり、利点はますます多くなります.