Die prepend-metode

Die metode prepend laat toe om aan die begin van 'n element 'n ander element in te voeg. As parameter neem die metode 'n element, gewoonlik geskep deur createElement, of 'n string. Jy kan verskeie elemente of strings gelyktydig byvoeg deur hulle met 'n komma te skei.

Sintaksis

javascriptouer.prepend(element of string);

Voorbeeld

Kom ons skep 'n paragraaf, stel die teks daarin en plaas dit op die bladsy aan die begin van blok #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);

Resultaat van die kode-uitvoering:

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

Voorbeeld

Laat ons verskeie paragrawe gelyktydig aan die begin van blok #parent plaas:

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);

Resultaat van die kode-uitvoering:

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

Voorbeeld

Kom ons gebruik 'n string as parameter van die metode:

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

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

Resultaat van die kode-uitvoering:

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

Sien ook