Metode prepend

Metode prepend ļauj ievietot kāda elementa sākumā citu elementu. Kā parametru metode pieņem elementu, parasti izveidotu ar createElement, vai virkni. Varat pievienot uzreiz vairākus elementus vai virknes, uzskaitot tos atdalot ar komatu.

Sintakse

vecāks.prepend(elements vai virkne);

Piemērs

Izveidosim rindkopu, iestatīsim tai tekstu un ievietosim lapas sākumā blokā #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);

Koda izpildes rezultāts:

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

Piemērs

Ievietosim uzreiz vairākas rindkopas sākumā 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);

Koda izpildes rezultāts:

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

Piemērs

Izmantosim kā metodes parametru virkni:

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

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

Koda izpildes rezultāts:

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

Skatiet arī

metode append,
kura ievieto elementus beigās
metode appendChild,
kura ievieto elementus beigās
metode insertBefore,
kura ievieto elementu pirms elementa
metode insertAdjacentElement,
kura ievieto elementu norādītajā vietā
metode insertAdjacentHTML,
kura ievieto atzīmes norādītajā vietā