Metoda prepend

Metoda prepend lejon futjen e një elementi tjetër në fillim të një elementi. Si parametër merr një element, zakonisht të krijuar përmes createElement, ose një varg. Mund të shtohen menjëherë disa elemente ose vargje, duke i numëruar ato përmes presjeje.

Sintaksa

prind.prepend(element ose varg);

Shembull

Le të krijojmë një paragraf, t'i caktojmë tekst dhe ta vendosim në faqe në fillim të bllokut #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);

Rezultati i ekzekutimit të kodit:

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

Shembull

Le të vendosim menjëherë disa paragrafë në fillim të bllokut #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);

Rezultati i ekzekutimit të kodit:

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

Shembull

Le të përdorim një varg si parametër të metodës:

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

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

Rezultati i ekzekutimit të kodit:

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

Shihni gjithashtu

metoda append,
që fut elementet në fund
metoda appendChild,
që fut elementet në fund
metoda insertBefore,
që fut elementin përpara elementit
metoda insertAdjacentElement,
që fut elementin në vendin e caktuar
metoda insertAdjacentHTML,
që fut etiketat në vendin e caktuar