JQuery知識一覧の3-JQueryオブジェクトセット
4821 ワード
JQueryオブジェクトセットの各関連知識について説明します
JQueryオブジェクトセットの取得
JQueryオブジェクトとDOMオブジェクトは2つの異なるものであり、JQueryオブジェクトはDOMオブジェクトのカプセル化でもよいが、JQueryオブジェクトはDOMオブジェクトのカプセル化だけでなく、カスタムオブジェクトを表すこともできる.なぜDOMオブジェクトを直接使用せずにJQueryオブジェクトを取得するのですか?JQueryオブジェクトはDOMオブジェクトの操作をよくカプセル化しているので、ブラウザの互換性の問題を心配することなく、JQueryオブジェクトの方法で内部カプセル化されたDOMオブジェクトを操作することができます.
JQuery関数は、$と略記されていますが、さまざまな使い方ができます.
1.$(DOM element)
DOM elementをJQueryオブジェクトにカプセル化し、前述した$(this)がこの使い方です.
2.$(DOM element array)
3.$(JQuery object)
既存のJQueryオブジェクトのクローン
4.$(object)
5.$()
空のJQueryオブジェクトセットを作成
6.$(selector[,context])
selectorは前述したセレクタであり,このセレクタを既存のDOMオブジェクト,DocumentまたはJQueryオブジェクトセットに使用することができる.$(selector,context)のように使用すると、効果は$(context)に等しい.find(selector)
7.jQuery( html [, ownerDocument ] )
htmlを解析し、ownerDocumentに追加する場合、htmlに複数のノードが含まれている場合、ownerDocumentに追加できるように一定の処理を行うことに注意してください.例えば
JQueryオブジェクトセットの取得
JQueryオブジェクトとDOMオブジェクトは2つの異なるものであり、JQueryオブジェクトはDOMオブジェクトのカプセル化でもよいが、JQueryオブジェクトはDOMオブジェクトのカプセル化だけでなく、カスタムオブジェクトを表すこともできる.なぜDOMオブジェクトを直接使用せずにJQueryオブジェクトを取得するのですか?JQueryオブジェクトはDOMオブジェクトの操作をよくカプセル化しているので、ブラウザの互換性の問題を心配することなく、JQueryオブジェクトの方法で内部カプセル化されたDOMオブジェクトを操作することができます.
JQuery関数は、$と略記されていますが、さまざまな使い方ができます.
1.$(DOM element)
DOM elementをJQueryオブジェクトにカプセル化し、前述した$(this)がこの使い方です.
2.$(DOM element array)
3.$(JQuery object)
既存のJQueryオブジェクトのクローン
4.$(object)
var foo = { foo: "bar", hello: "world" };
var $foo = $( foo );
5.$()
空のJQueryオブジェクトセットを作成
6.$(selector[,context])
selectorは前述したセレクタであり,このセレクタを既存のDOMオブジェクト,DocumentまたはJQueryオブジェクトセットに使用することができる.$(selector,context)のように使用すると、効果は$(context)に等しい.find(selector)
7.jQuery( html [, ownerDocument ] )
htmlを解析し、ownerDocumentに追加する場合、htmlに複数のノードが含まれている場合、ownerDocumentに追加できるように一定の処理を行うことに注意してください.例えば
で先に包装したり、直接のテキストを削除したり、、ラベルを削除したりします.
8.jQuery( html, attributes )
単純な要素にプロパティを指定します.
オブジェクトセット要素の管理
初期のオブジェクトセットを構築すると、オブジェクトセットのマージ、オブジェクトセットのフィルタリングなど、オブジェクトセットの管理も可能になります.
1.オブジェクトセットのマージ
add(selector|elements|html|JQuery object)
add(selector, context)
2つのオブジェクトセットの合計を行い、結果としてオブジェクトセットの順序はDOMの順序に従います.
addback()
1.8版はandSelf機能の代わりに追加されました.
このオブジェクトセットのオブジェクトと前回のオブジェクトセットのオブジェクトを結合します.
2.サブオブジェクトセットの取得
first()
オブジェクトセットの最初の要素の取得
last()
オブジェクトセットの最後の要素を取得
eq(index)
オブジェクトセットの所定の位置の要素を取得し、0からカウントを開始し、負の場合は後から数えます.
slice(start [,end])
オブジェクトセットの指定範囲内の要素を取得し、0からカウントを開始し、負の場合は後から数えます.
3.フィルタ対象セット
filter(selector|element|function(index)|JQuery object)
オブジェクトセットから条件を満たすノードを残す
not(selector|elements|function(index)|JQuery object)
オブジェクトセットから条件を満たすノードを削除します.
4.オブジェクトセットのサブエレメントまたは子孫エレメントを取得
contents()
オブジェクトセットのオブジェクトのすべてのテキストとセクションのサブ要素を取得します.
children([selector])
オブジェクトセットのオブジェクトのすべてのセクションサブ要素を取得します.セレクタがある場合、サブエレメントはセレクタの条件を満たす必要があります.そうしないと取得されません.
find(selector|element|JQuery object)
オブジェクトセットの子孫ノードの条件を満たすすべての要素を検索します.次の2つのパラメータ形式は1.6版で追加されました.
has(selector|contained element)
オブジェクトセットの条件を満たすすべての子孫ノードを持つオブジェクトを取得します.
5.オブジェクトセットの親要素または祖先要素を取得
parent([selector])
オブジェクトセットのすべてのノードの親要素を取得します.セレクタがある場合、親要素はセレクタの条件を満たす必要があります.そうしないと取得されません.
parents([selector])
オブジェクトセットのすべてのノードの祖先要素を取得します.セレクタがある場合、祖先要素はセレクタの条件を満たす必要があります.そうしないと取得されません.
parentsUntil[selector [,filter]|element [,filter]]
オブジェクトセットの各オブジェクトについて、セレクタの条件を満たす祖先要素があるまで、その祖先要素を順番に取得します.
offsetParent()
オブジェクトセットの各オブジェクトについて、relative、absolute、fixedの位置を持つ祖先要素があるまで、その祖先要素を順番に取得します.
closest(selector [,context]|element|JQuery object)
オブジェクトセット内のすべてのオブジェクトに対して、ルートノードが見つかるか見つかるまで、親ノードに条件を満たす要素を順に検索します.次の2つのパラメータ形式は1.6版で追加されました.
6.オブジェクトセットを取得した隣人
prev[selector]
オブジェクトセットの各オブジェクトの前の要素を取得し、セレクタが付いている場合は、前の要素が条件に合致している場合に取得します.そうでない場合は取得しません.
next[selector]
オブジェクトセットの各オブジェクトの後ろの要素を取得し、セレクタが付いている場合は、前の要素が条件に合致している場合に取得します.そうでない場合は取得しません.
prevAll[selector]
オブジェクトセットの各オブジェクトの前にあるセレクタ条件を満たす要素をすべて取得します.
nextAll[selector]
オブジェクトセットの各オブジェクトの後ろにあるセレクタ条件を満たす要素をすべて取得します.
prevUntil[selector [,filter]|element [,filter]]
オブジェクトセットの各オブジェクトの前の要素を、セレクタの条件を満たす要素があるまで順に取得します.
nextUntil[selector [,filter]|element [,filter]]
オブジェクトセットの各オブジェクトの後ろにある要素を、セレクタの条件を満たす要素があるまで順に取得します.
siblings([selector])
オブジェクトセットの各オブジェクトのセレクタ条件を満たすすべての隣接要素を取得します.
7.その他
end()
前回の操作後の結果オブジェクトセットに戻ります.
操作オブジェクトセット
オブジェクトセットを取得すると、
is(selector|element|function(index)|JQuery object)
テスト対象セットに条件を満たす要素があるかどうか、後の3つのパラメータ形式は1.6版に追加されました.
map(callback(index, element))
オブジェクトセット内のすべてのオブジェクトに対して指定された操作を実行して結果を返します.この関数は、通常get()とともに使用され、所与の操作を行った結果セットを取得します.
each(function(index, element)
オブジェクトセットのすべてのオブジェクトに対して所定の操作を実行する.
8.jQuery( html, attributes )
単純な要素にプロパティを指定します.
$("<a></a>",{
"href":"baidu.com",
text:"append",
on:{
click:function(){
alert("clicked");
}
}
}).appendTo("li");
オブジェクトセット要素の管理
初期のオブジェクトセットを構築すると、オブジェクトセットのマージ、オブジェクトセットのフィルタリングなど、オブジェクトセットの管理も可能になります.
1.オブジェクトセットのマージ
add(selector|elements|html|JQuery object)
add(selector, context)
2つのオブジェクトセットの合計を行い、結果としてオブジェクトセットの順序はDOMの順序に従います.
addback()
1.8版はandSelf機能の代わりに追加されました.
このオブジェクトセットのオブジェクトと前回のオブジェクトセットのオブジェクトを結合します.
2.サブオブジェクトセットの取得
first()
オブジェクトセットの最初の要素の取得
last()
オブジェクトセットの最後の要素を取得
eq(index)
オブジェクトセットの所定の位置の要素を取得し、0からカウントを開始し、負の場合は後から数えます.
slice(start [,end])
オブジェクトセットの指定範囲内の要素を取得し、0からカウントを開始し、負の場合は後から数えます.
3.フィルタ対象セット
filter(selector|element|function(index)|JQuery object)
オブジェクトセットから条件を満たすノードを残す
not(selector|elements|function(index)|JQuery object)
オブジェクトセットから条件を満たすノードを削除します.
4.オブジェクトセットのサブエレメントまたは子孫エレメントを取得
contents()
オブジェクトセットのオブジェクトのすべてのテキストとセクションのサブ要素を取得します.
children([selector])
オブジェクトセットのオブジェクトのすべてのセクションサブ要素を取得します.セレクタがある場合、サブエレメントはセレクタの条件を満たす必要があります.そうしないと取得されません.
find(selector|element|JQuery object)
オブジェクトセットの子孫ノードの条件を満たすすべての要素を検索します.次の2つのパラメータ形式は1.6版で追加されました.
has(selector|contained element)
オブジェクトセットの条件を満たすすべての子孫ノードを持つオブジェクトを取得します.
5.オブジェクトセットの親要素または祖先要素を取得
parent([selector])
オブジェクトセットのすべてのノードの親要素を取得します.セレクタがある場合、親要素はセレクタの条件を満たす必要があります.そうしないと取得されません.
parents([selector])
オブジェクトセットのすべてのノードの祖先要素を取得します.セレクタがある場合、祖先要素はセレクタの条件を満たす必要があります.そうしないと取得されません.
parentsUntil[selector [,filter]|element [,filter]]
オブジェクトセットの各オブジェクトについて、セレクタの条件を満たす祖先要素があるまで、その祖先要素を順番に取得します.
offsetParent()
オブジェクトセットの各オブジェクトについて、relative、absolute、fixedの位置を持つ祖先要素があるまで、その祖先要素を順番に取得します.
closest(selector [,context]|element|JQuery object)
オブジェクトセット内のすべてのオブジェクトに対して、ルートノードが見つかるか見つかるまで、親ノードに条件を満たす要素を順に検索します.次の2つのパラメータ形式は1.6版で追加されました.
6.オブジェクトセットを取得した隣人
prev[selector]
オブジェクトセットの各オブジェクトの前の要素を取得し、セレクタが付いている場合は、前の要素が条件に合致している場合に取得します.そうでない場合は取得しません.
next[selector]
オブジェクトセットの各オブジェクトの後ろの要素を取得し、セレクタが付いている場合は、前の要素が条件に合致している場合に取得します.そうでない場合は取得しません.
prevAll[selector]
オブジェクトセットの各オブジェクトの前にあるセレクタ条件を満たす要素をすべて取得します.
nextAll[selector]
オブジェクトセットの各オブジェクトの後ろにあるセレクタ条件を満たす要素をすべて取得します.
prevUntil[selector [,filter]|element [,filter]]
オブジェクトセットの各オブジェクトの前の要素を、セレクタの条件を満たす要素があるまで順に取得します.
nextUntil[selector [,filter]|element [,filter]]
オブジェクトセットの各オブジェクトの後ろにある要素を、セレクタの条件を満たす要素があるまで順に取得します.
siblings([selector])
オブジェクトセットの各オブジェクトのセレクタ条件を満たすすべての隣接要素を取得します.
7.その他
end()
前回の操作後の結果オブジェクトセットに戻ります.
操作オブジェクトセット
オブジェクトセットを取得すると、
$( "li" ).css( "background-color", "red" ); $("li") 。JQuery , , :
などのオブジェクトセットに対してさまざまな操作を行うことができます.is(selector|element|function(index)|JQuery object)
テスト対象セットに条件を満たす要素があるかどうか、後の3つのパラメータ形式は1.6版に追加されました.
map(callback(index, element))
オブジェクトセット内のすべてのオブジェクトに対して指定された操作を実行して結果を返します.この関数は、通常get()とともに使用され、所与の操作を行った結果セットを取得します.
each(function(index, element)
オブジェクトセットのすべてのオブジェクトに対して所定の操作を実行する.