jquery (organized)_jquery を使い始めるために必要な基本的な理解と例

1.Juqery は JavaScript の優れたフレームワークです。これは、CSS3 およびさまざまなブラウザー (IE 6.0、FF 1.5、Safari 2.0、Opera 9.0) と互換性のある軽量の JS ライブラリです。jQuery2.0 以降のバージョンでは、IE6/7/8 ブラウザーはサポートされなくなります。 jQuery を使用すると、ユーザーは HTML ドキュメントとイベントをより簡単に処理し、アニメーション効果を実装し、Web サイトに AJAX インタラクションを簡単に提供できるようになります。

jQuery のもう 1 つの大きな利点は、ドキュメントが非常に充実しており、さまざまなアプリケーションが詳細に説明されていることです。また、選択できる成熟したプラグインも多数あります。 jQuery は、ユーザーの HTML ページのコードと HTML コンテンツを分離したままにすることができます。つまり、コマンドを呼び出すために HTML に大量の js を挿入する必要はありません。必要なのは ID を定義することだけです。

jQuery2.0 フレームワークを使用する場合、上記の段落を通じて私が言いたいのは、一部のコードが Eclipse で実行できない場合、それはブラウザーのカーネルが低すぎることを意味します。ブラウザのバージョンが高いほど効果が現れます。

2. jQuery ライブラリには次の機能が含まれています:
・HTML 要素の選択
・HTML 要素の操作
・CSS の操作
・HTML イベント関数
・JavaScript の特殊効果およびアニメーション
・HTML DOM のトラバーサルと変更
・AJAX
・ユーティリティ
3. Google と Microsoft はどちらも jQuery を非常によくサポートしています。
コンピューターで jQuery ライブラリをホストしたくない場合は、Google または Microsoft から CDN jQuery コア ファイルをロードできます。
Google の CDN を使用します

コードをコピーします コードは次のとおりです。

< head>

基本構文:
jQuery 構文例
$(this ).hide()
現在の HTML 要素を非表示にする jQuery Hide() 関数を示します。
$("#test").hide() //id を読み取ります
id="test" の要素を非表示にする jQuery の Hide() 関数を示します。
$("p").hide()
すべての

要素を非表示にする jQuery の Hide() 関数を示します。 //この方法でタグを直接読み取ることができます
$(".test").hide()
class="test" を含むすべての要素を非表示にする jQuery の Hide() 関数を示します。 //クラスの要素ノードを読み取ります

Jquery には多くのセレクターがあります: jQuery 要素セレクター
jQuery は CSS セレクターを使用して HTML 要素を選択します。
$("p") は

要素を選択します。
$("p.intro") は、class="intro" を持つすべての

要素を選択します。
$("p#demo") は、id="demo" を持つすべての

要素を選択します。
jQuery 属性セレクター
jQuery は XPath 式を使用して、指定された属性を持つ要素を選択します。
$("[href]") は、href 属性を持つすべての要素を選択します。
$("[href='#']") は、href 値が「#」に等しいすべての要素を選択します。
$("[href!='#']") は、href 値が「#」に等しくないすべての要素を選択します。
$("[href$='.jpg']") は、href 値が「.jpg」で終わるすべての要素を選択します。
jQuery CSS セレクター
jQuery CSS セレクターは、HTML 要素の CSS プロパティを変更するために使用できます。

次の例では、すべての p 要素の背景色を赤に変更します。
例

コードをコピーコードは次のとおりです。

$("p").css("background-color","re​​d");

jQuery イベント
以下 jQuery のイベント メソッドの例をいくつか示します。

Event 函数	绑定函数至
$(document).ready(function)	将函数绑定到文档的就绪事件（当文档完成加载时）
$(selector).click(function)	触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function)	触发或将函数绑定到被选元素的双击事件
$(selector).focus(function)	触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function)	触发或将函数绑定到被选元素的鼠标悬停事件