要素を操作する際に使用するメソッドに関するメモ。要素にコンテンツを追加ラップ集合の全要素(既存のコンテンツ)に対して渡されたコンテンツ(引数で指定した要素等)を追加するメソッドは以下のようなものがある。断片あるいは要素を、マッチした全要素のコンテンツの末尾に追加する。関数のいずれかで指定。関数ならばラップされた各要素について呼び出される。既存のコンテンツを2つのパラメータとして渡される。この関数の戻り値が、追加すべきコンテンツとして使われる。元の要素は前にあった場所から削除される。「既存の子要素」の末尾に追加される。<div>追加されるコンテンツ</div></div>パラメータに関数を指定した場合もしパラメータが関数ならばラップされた各要素について呼び出される。既存のコンテンツを2つのパラメータとして渡されるこの関数の戻り値が、追加すべきコンテンツとして使われる以下は全く実用的ではないサンプル。断片あるいは要素を、マッチした全要素のコンテンツの先頭に追加する。関数のいずれかで指定。関数ならばラップされた各要素について呼び出される。既存のコンテンツを2つのパラメータとして渡される。この関数の戻り値が、追加すべきコンテンツとして使われる。元の要素は前にあった場所から削除される。「既存の子要素」の先頭に追加される。</div>after渡されたHTML断片または要素をマッチした全要素の弟として、その直後に挿入する。関数のいずれかで指定。関数ならばラップされた各要素について呼び出され、その要素が関数コンテクストとして渡される。要素インデックスをパラメータとして渡される。コンテクストとして挿入される。元の要素は前にあった場所から削除される。後に(弟として)追加される。</div><div>追加されるコンテンツ</div>before渡されたHTML断片または要素をマッチした全要素の兄として、その直前に挿入する。関数のいずれかで指定。関数ならばラップされた各要素について呼び出され、その要素が関数コンテクストとして渡される。要素インデックスをパラメータとして渡される。コンテクストとして挿入される。元の要素は前にあった場所から削除される。先頭に(兄として)追加される。</div>要素をコンテンツに追加ラップ集合の全要素を指定されたターゲット郡のコンテンツに追加する。要素同士の位置関係サンプルappendToラップ集合の全要素を指定されたターゲット郡のコンテンツの末尾に追加する。内容の後ろに追加される。元の要素は前にあった場所から削除される。「既存の子要素」の末尾に追加される。<div>追加されるコンテンツ</div></div>prependToラップ集合の全要素を指定されたターゲット郡のコンテンツの先頭に追加する。ラップ集合の各要素が、ターゲットの各要素の内容よりも前に追加される。元の要素は前にあった場所から削除される。「既存の子要素」の先頭に追加される。</div>insertAfterラップ集合の全要素をDOMの指定されたターゲットの直後に追加する。書式$(セレクタ).insertAfter(targets);パラメータtargets(String|Element)jQueryセレクタを含む文字列またはDOM要素。元の要素は前にあった場所から削除される。後に(弟として)追加される。指定されたターゲットの直前に追加する。書式$(セレクタ).insertBefore(targets);パラメータtargets(String|Element)jQueryセレクタを含む文字列またはDOM要素。元の要素は前にあった場所から削除される。先頭に(兄として)追加される。</div>要素のラッピングとアンラッピング要素を何らかのマークアップの中にラッピングするにはwrap()メソッドを使う。サンプルwrapマッチした集合の要素を渡されたHTMLタグ(または渡された要素のクローン:クローンは自動的に作成される)でラップする。クローニングしてラッパーにすべき要素。</div></div>複数の要素がマッチしたとき、もし集合の中にある全要素を一括してラップしたいのなら、wrapAll()メソッドを使う。タグ(または渡された要素のクローン)でラップする。クローニングしてラッパーにすべき要素。</div></div>マッチした集合の中にある要素ではなく、そのコンテンツ(その要素配下の子要素)をラップしたい場合はwrapInner()を使う。クローニングしてラッパーにすべき要素。メソッドとの違いは、カレント要素そのものを囲むのか、それともカレント要素配下の子要素(またはテキスト)を囲むかの違い。子要素の親を削除する(つまり、ラップを外す)処理は、unwrap()メソッドで行う。unwrapラップされている要素郡の親要素(コンテナ)を削除する。子要素が(その兄弟とともに)DOM内で親要素を置き換える。green;”」が取り除かれる。<p>WordPress</p></div>要素の置換サンプルreplaceWithマッチした要素のそれぞれを指定のコンテンツで置き換える。移動する要素への参照。関数なら、ラップされた個々の要素について、その関数が呼び出される。パラメータは渡されない。この関数の戻り値が新しいコンテンツとして使われる。要素で置き換える(画像をそのalt値の文字列で置き換える)例。使わず以下のように記述しても同じ結果になる。'</span>';});画像のサイズを変更する例。使わず以下のように記述しても同じ結果になる。});});replaceAll()では、replaceWith()と同じ処理を実行する際、指定の順序が逆転する(入れ替わる)。replaceAll「selector」で選択された要素を全て(コンテンツ)置き換える。引数の関係が逆になっているだけで、同じ動作をする。置き換える内容は同じもの(コンテンツ)になるので、特定の要素を全て「同じ内容」に置き換えるのに使う場合に便利。(Selector)置き換える要素を識別するセレクタの文字列式。置換前の要素は失われ、この後は操作が不可能になる。どちらの置換メソッドを使うかは、この点にも配慮する必要がある。要素('<p>Photo</p>’)に置き換える例。img');});要素のクローン(コピー)の作成サンプルラップ集合に入っている要素のコピーを作り、それらを含む新しいラップ集合を返す。要素に子孫があれば、それらもコピーされる。オプションを指定すれば、イベントハンドラもコピーされる。600).addClass('clone').appendTo('div#photo');クローンを挿入後、end()メソッドを使って元のラップ集合(クローンもとのターゲット)を選択し、それを隠す例。img.beach').clone().appendTo('div#photo').end().end().hide();要素の削除サンプルremoveラップ集合に含まれる全ての要素をページDOMから削除する。(String)オプション。ラップ集合のうち、削除すべき要素のみを指定するフィルタセレクタ。データやイベントがあればそれらは削除される。画像要素のうち、クラスが「clone」のものを削除する例。要素を削除するが、削除した要素にバインドされていたイベントやデータは削除されない。(String)オプション。ラップ集合のうち、切り離しの対象とする要素のみを指定するフィルタセレクタ。戻したい場合に適している。emptyマッチした集合の、全部のDOM要素の「内容」を削除する。要素自体は削除されず、そのまま残る。オブジェクト)を生成することができる。