Metoda prepend

Metoda prepend omogoča vstavljanje drugega elementa na začetek katerega koli elementa. Kot parameter metoda sprejme element, običajno ustvarjen z createElement, ali niz. Možno je dodati več elementov ali nizov hkrati, tako da jih naštejemo ločene z vejico.

Sintaksa

starš.prepend(element ali niz);

Primer

Ustvarimo odstavek, nastavimo mu besedilo in ga postavimo na stran na začetek bloka #parent:

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

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

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

parent.prepend(p);

Rezultat izvajanja kode:

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

Primer

Postavimo več odstavkov hkrati na začetek bloka #parent:

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

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

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

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

parent.prepend(p1, p2);

Rezultat izvajanja kode:

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

Primer

Uporabimo niz kot parameter metode:

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

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

Rezultat izvajanja kode:

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

Glejte tudi

metoda append,
ki vstavi elemente na konec
metoda appendChild,
ki vstavi elemente na konec
metoda insertBefore,
ki vstavi element pred element
metoda insertAdjacentElement,
ki vstavi element na določeno mesto
metoda insertAdjacentHTML,
ki vstavi oznake na določeno mesto