Metoden prepend

Metoden prepend gør det muligt at indsætte et andet element i begyndelsen af et element. Som parameter tager metoden et element, som som regel er oprettet via createElement, eller en streng. Det er muligt at tilføje flere elementer eller strenge på én gang ved at angive dem adskilt af komma.

Syntaks

javascriptforælder.prepend(element eller streng);

Eksempel

Lad os oprette et afsnit, sætte dets tekst og placere det på siden i begyndelsen af blokken #parent:

html<div id="parent">
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

javascriptlet parent = document.querySelector('#parent');

let p = document.createElement('p');
p.textContent = '!';

parent.prepend(p);

Resultatet af udførelsen af koden:

html<div id="parent">
  <p>!</p>
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

Eksempel

Lad os placere flere afsnit på én gang i begyndelsen af blokken #parent:

html<div id="parent">
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

javascriptlet parent = document.querySelector('#parent');

let p1 = document.createElement('p');
p1.textContent = 'a';

let p2 = document.createElement('p');
p2.textContent = 'b';

parent.prepend(p1, p2);

Resultatet af udførelsen af koden:

html<div id="parent">
  <p>b</p>
  <p>a</p>
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

Eksempel

Lad os bruge en streng som parameter for metoden:

html<div id="parent">
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

javascriptlet parent = document.querySelector('#parent');
parent.prepend('!');

Resultatet af udførelsen af koden:

html<div id="parent">
  !
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

Se også