16 of 119 menu

Método after

O método after adiciona texto após o elemento especificado. Também existe o método insertAfter, que funciona de maneira semelhante.

Sintaxe

Inserindo texto após o elemento:

$(seletor).after(texto);

Desta forma, após os elementos selecionados será adicionado o texto que será retornado pela função personalizada. A função é chamada separadamente para cada um dos elementos selecionados. No primeiro parâmetro desta função é passado o índice na coleção de cada um dos elementos selecionados (por vez), no segundo - o conteúdo atual do elemento:

$(seletor).after(function(índice na coleção, conteúdo atual do elemento));

O texto também pode não ser apenas texto comum, mas também um elemento DOM ou um objeto jQuery. Neste caso, esses elementos serão movidos de sua posição no código HTML.

Exemplo

Vamos inserir texto após o parágrafo especificado:

<p id="test">text</p> $('#test').after('!!!');

O código HTML ficará assim:

<p id="test">text</p>!!!

Exemplo

Vamos inserir texto com tags após o parágrafo especificado:

<p id="test">text</p> $('#test').after('<p>!!!</p>');

O código HTML ficará assim:

<p id="test">text</p><p>!!!</p>

Exemplo

Vamos mover um parágrafo para abaixo do outro (ou seja, recortar o parágrafo do local antigo e colocar no novo):

<p id="p1">text1</p> <p id="p2">text2</p> $('#p1').after($('#p2'));

O código HTML ficará assim:

<p id="p1">text1</p> <p id="p2">text2</p>

Veja também

  • método insertAfter,
    que adiciona texto após o elemento especificado
  • métodos before, append, prepend,
    permitindo adicionar conteúdo em um determinado local na página
  • método clone,
    que cria cópias dos elementos selecionados
azbydeenesfrkakkptruuz