Metoda before

Metoda before dodaje tekst przed określonym elementem. Istnieje również metoda insertBefore, która działa w podobny sposób.

Składnia

Wstawianie tekstu przed elementem:

javascript$(selektor).before(tekst);

W ten sposób przed wybranymi elementami zostanie dodany tekst, który zostanie zwrócony przez funkcję użytkownika:

javascript$(selektor).before(function(numer w zestawie));

Kolejny wariant użycia funkcji, gdzie drugi parametr określa starą wartość html elementu:

javascript$(selektor).before(function(numer w zestawie, ciąg znaków html));

Tekst może być nie tylko zwykłym tekstem, ale także elementem DOM lub obiektem jQuery. W tym przypadku te elementy zostaną przeniesione ze swojej pozycji w kodzie HTML.

Przykład

Wstawmy tekst przed określonym akapitem:

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

Kod HTML będzie wyglądać tak:

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

Przykład

Wstawmy tekst ze znacznikami przed określonym akapitem:

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

Kod HTML będzie wyglądać tak:

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

Przykład

Umieśćmy jeden akapit nad drugim (to znaczy wytnijmy akapit ze starego miejsca i umieśćmy w nowym):

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

Kod HTML będzie wyglądać tak:

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

Zobacz też

  • metoda insertBefore,
    która dodaje tekst przed określonym elementem
  • metody after, append, prepend,
    pozwalające dodawać zawartość w określone miejsce na stronie
  • metoda clone,
    która tworzy kopie wybranych elementów