afterメソッド
メソッド after は、指定した要素の後ろに
テキストを追加します。同様の動作をするメソッドとして、
insertAfter
もあります。
構文
要素の後ろにテキストを挿入します:
$(セレクター).after(テキスト);
このように、選択された各要素の後ろに、 カスタム関数によって返されるテキストが追加されます。 この関数は、選択された各要素に対して個別に呼び出されます。 関数の最初のパラメーターにはセット内の要素のインデックスが（順番に）、 2番目のパラメーターには要素の現在の内容が渡されます:
$(セレクター).after(function(セット内のインデックス, 要素の現在の内容));
テキストは通常のテキストだけでなく、 DOM要素やjQueryオブジェクトにすることもできます。 その場合、それらの要素はHTMLコード内の元の位置から移動されます。
例
指定した段落の後ろにテキストを挿入してみましょう:
<p id="test">text</p>
$('#test').after('!!!');
HTMLコードは次のようになります:
<p id="test">text</p>!!!
例
指定した段落の後ろにタグ付きのテキストを挿入してみましょう:
<p id="test">text</p>
$('#test').after('<p>!!!</p>');
HTMLコードは次のようになります:
<p id="test">text</p><p>!!!</p>
例
ある段落を別の段落の下に移動させてみましょう （つまり、段落を古い位置から切り取り、新しい位置に配置します）:
<p id="p1">text1</p>
<p id="p2">text2</p>
$('#p1').after('#p2');
HTMLコードは次のようになります:
<p id="p2">text2</p>
<p id="p1">text1</p>
関連項目
-
メソッド
insertAfter,
指定した要素の後ろにテキストを追加します -
メソッド
before,append,prepend,
ページの特定の場所にコンテンツを追加することができます -
メソッド
clone,
選択した要素のコピーを作成します
