Jqueryは指定されたtag_jqueryのオブジェクトと属性の設定と削除を取得します

1. まず JQuery の概念について話しましょう。JQuery はアメリカの John Resig という人物によって最初に作成されました。その後、多くの JS 専門家もチームに加わりました。実際、JQuery は JavaScript クラス ライブラリであり、このクラス ライブラリを使用すると、いくつかの単純なコードを使用して複雑な JS 効果を実現できます。

2. JQuery はコードの分離を実現します。Web ページに関数を呼び出すために onclick などのイベントを追加する必要はありません。JQuery クラス ライブラリと自分で作成した JQuery コードを直接導入できます。 🎜> 例:

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

$(function( ){
$ ("要素").click{
function(){alert("クリックしてください!")
}
}
});
上記のコードでは、Element が定義されている限り、この要素の後ろの click はアクション
alert (「Click on me!」) です。もちろん、これを実行することもできます。この関数には多くの操作があります。

ここでの $ 記号は、クラス ライブラリへの参照である JQuery を表します。 。 。

3. JQuery のコアメソッドのいくつか

each(callback) 'ループのようなものです

$("Element").length ; ' 要素の数は属性です

$(“Element”).size(); ' これは要素の数でもありますが、括弧付きではメソッド

$( “Element”).get (); '配列形式で保存されたページ内の要素のコレクション

$("Element").get(index); '関数は次と同じです。上記では、index は要素を表し、配列のインデックス

$(“Element”).get().reverse() '取得した配列の方向を変更します

$(“Element1 '').index($(“Element2 '')); '要素 1 の要素 2 のインデックス値は次のとおりです。 。 。

4. 基本的なオブジェクトの取得

$(“*”) 'すべてのオブジェクトを取得することを示します

$(”#element”) 'CSSと同じID番号を取得します

$(".abc") '.abc スタイルを使用するすべての要素

$("div") 'タグセレクターはすべての div 要素を選択します

$( "# a,.b,span") 'ID が a の要素、クラス スタイル b を使用する要素、およびすべての Span 要素を取得することを示します

$("#a .b p") 'ID 番号は a で、次を使用しますb スタイルのすべての p 要素

5. 階層要素の取得

$("Element1 Element2 Element3 ....") '前の親の後にサブセットが続きます

$("div > p") 'div 以下のすべての p 要素を取得

$("div p") 'div 要素の後の最初の p 要素

$("div ~ p") 'div

以降のすべての p 要素6. 単純なオブジェクト取得

$("Element:first") 'HTML ページ内の特定の種類の要素の最初の要素element

$("Element:last") 'HTML ページ内の特定の種類の要素の最後の要素

$("Element:not(selector)") 'すべての要素を削除$("input:not(:checked)") は、チェックされていないチェック ボックスをすべて選択することを意味します

$("Element:even") '偶数行を取得します

$("Element:odd") '奇数の行を取得します

$("Element:eq(index)") '指定されたインデックス値を取得します

$(" Element:gt(index)") '指定されたインデックス値を持つ要素の後のすべての要素を取得します

$("Element:lt(index)") '指定されたインデックス値を持つ要素の前のすべての要素を取得します

。 。 。

7. コンテンツオブジェクトの取得とオブジェクトの可視性

$("Element:contains(text)") '要素にテキストコンテンツが含まれるかどうか

$(' 要素: empty") '

$("Element:partnt") を取得します。 '

$("Element:has (selector)") を取得します。 '次のような特定の要素が含まれているかどうか: $("p:has(span)") は、span 要素を含むすべての p 要素を意味します

$("Element:hidden") 'すべての表示可能な要素を選択します

$(“Element:visible ”) ' 非表示の要素をすべて選択

8. その他のオブジェクト取得方法

$(“Element[id]”) ' ID 属性を持つすべての要素

$("Element [attribute = youlika ]" 'youlika の属性を持つ要素をすべて取得します

$("Element[attribute != youlika ]" 'youlika ではない特定の属性を持つ要素をすべて取得します

$("Element[attribute ^= youlika]" 'youlika ではない特定の属性で始まる要素をすべて取得します

$(" Element[attribute $= youlika ]" '次の要素をすべて取得しますyoulika で終わらない属性

$("Element[attribute *= youlika ]" 'youlika で始まる属性を持つ要素をすべて取得

$("Element[selector1][ selector2][....]") '$("input[id][name][value=youlika]") などの属性セレクターに準拠し、ID、名前、値を持つ入力要素を取得することを意味します

9. 子要素の取得

$("Element:nth-child(index)") '親要素より下の要素

$(" Element:nth-child(even)") '親の下の偶数を選択します

$("Element:nth-child(odd)") '親の下の奇数を選択します

$(“Element:nth-child(3n 1)”) 'Expression

$(“Element:first-child”) '親の下の奇数を選択 最初の子要素 ​​

$("Element:last-child") '親の下にある最後の子要素を選択します

$("Element:only-child") '親の下にある唯一の子要素と一致します (例: dt) DL リストにあるのは 1 つだけである場合、dt

10. フォーム オブジェクトを取得します

$(:input)//すべての入力要素を検索します。もちろん、ドロップダウン リストも含まれます。テキストフィールド、ラジオボタン、チェックボックスなど。

$(:text)//すべての単一行テキスト ボックスと一致します

$(:password)//すべてのパスワード ボックスと一致します

$(:radio)//すべてのラジオ ボタンに一致

$(:checkbox)//すべてのチェック ボックスに一致

$(:submit)//すべての送信ボタンに一致

$ (:image)/ / などのすべての画像フィールドと一致します

$(:reset)//すべてのリセット ボタンと一致します

$ (:button)//一致すべてのボタン

$(:file)//すべてのファイル アップロード ドメインと一致します

$(:hidden)//すべての非表示要素またはタイプと一致します 非表示要素の場合

$( :enabled)//すべての使用可能な入力要素に一致します。たとえば、radio:enabled は、すべての使用可能なラジオ ボタンに一致することを意味します

$(:disabled)//すべての使用できない入力要素には、上記と逆の効果があります

$(:checked)//選択されたチェックボックス要素をすべて一致させます

$(:selected)//ドロップダウンリストをすべて一致させます

11. 要素属性の設定と削除

$("Element").attr(name) '$("img") など、最初に一致する属性値を取得します。

$("Element".attr (key,value)”) '特定の要素に属性を設定します

$(“Element”.attr({key:value ,key1:value,….})) '要素に複数の属性を設定しますOnce

$(“Element”).attr(key,function) '一致するすべての要素の属性値に計算された属性を設定します。

$(“Element”).removeAttr(name)/ /属性を削除する