JQueryの基本構文まとめ_jquery

1. $(document) はドキュメントオブジェクトを jquery

に変換します。

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

$(document).ready(function(){
alert("hello world");
});

2. すべてのハイパーリンク オブジェクトを取得し、onclick イベントを追加します。実際、基になる jquery オブジェクトは各タグの配列を取得するため、

をループする必要はありません。

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

$(document).ready(function(){
$("a").click(function(){
alert("hello world");
});
});

3. jquery オブジェクトと dom オブジェクト間の変換

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

$(document).ready(function(){
var javascriptElement = document.getElementById("clickme");
// dom オブジェクトを jquery オブジェクトに変換します
var jqueryElement = $(javascriptElement);
//alert("javascript:" javascriptElement.innerHTML);//innerHTML はタグの内容を取得します
//alert("jquery:" jqueryElement.html());
//jquery を dom オブジェクトメソッド 1 に変換します
var jElement = $("#clickme");
var javascriptEle = jElement[0];
alert("jquery1: " javascriptEle.innerHTML);
//方法 2
var javascriptEle2 = jElement.get(0);
alert("jquery2: " javascriptEle2.innerHTML);
});

4. jquery は id 値が存在するかどうかの問題を解決します

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

クリックしてください
<スクリプトタイプ="text/javascript">
//空の ID の問題を解決する従来の方法は 1 つです
If(document.getElementById("hello")) {
//hello が存在しない場合はエラーが発生します
document.getElementById("hello").style.color ="red";
}
//方法 2
//$("#hello")[0].style.color="red";
// jquery を使用して
を解決します $("#hello").css("色","赤");
//パラメータが 1 つしかない場合はこのメソッドが読み取られ、パラメータが 2 つある場合はいくつかの関数 (css (""), css ("", ""))
alert($("#hello").css("color"));

5. CSS 属性を操作する場合は、属性内の「-」を削除し、最後の文字を大文字にすることが JavaScript で規定されています。たとえば、background-color は、backgroundColor に変更する必要があります。

6. セレクターは、jquery でさまざまな要素を操作するためにも使用されます 。 CSS の設計コンセプトを継承していますが、それを継承しています。

7. jquery のいくつかの記述形式

1> 方法 1

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

$("ドキュメント").ready(function(){
...
});

2> 方法 2

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

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

3> 方法 3

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

$(関数(){
...
});

上記の方法は同じです

この記事が jquery プログラミングを学習するすべての人に役立つことを願っています。