prepend әдісі

prepend әдісі кейбір элементтің басына басқа элементті кірістіруге мүмкіндік береді. Әдіс параметрі ретінде әдетте createElement арқылы жасалған элементті немесе жолды қабылдайды. Бірнеше элементтерді немесе жолдарды бірден қосуға болады, оларды үтір арқылы атап өту керек.

Синтаксис

ата-ана.prepend(элемент немесе жол);

Мысал

Абзац жасап, оған мәтін берейік және оны бетке #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);

Кодты орындау нәтижесі:

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

Мысал

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

Кодты орындау нәтижесі:

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

Мысал

Әдіс параметрі ретінде жолды қолданайық:

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

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

Кодты орындау нәтижесі:

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

Сондай-ақ қараңыз

append әдісі,
элементтерді соңына кірістіреді
appendChild әдісі,
элементтерді соңына кірістіреді
insertBefore әдісі,
элементті элементтің алдына кірістіреді
insertAdjacentElement әдісі,
элементті көрсетілген орынға кірістіреді
insertAdjacentHTML әдісі,
тегтерді көрсетілген орынға кірістіреді