Metóda prepend

Metóda prepend umožňuje vložiť na začiatok nejakého elementu iný element. Parametrom metódy je element, vytvorený typicky cez createElement, alebo reťazec. Je možné pridať naraz niekoľko elementov alebo reťazcov, uvedených oddelených čiarkou.

Syntax

rodič.prepend(element alebo reťazec);

Príklad

Vytvorme odsek, nastavme mu text a umiestnime na stránku na začiatok bloku #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);

Výsledok vykonania kódu:

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

Príklad

Umiestnime naraz niekoľko odsekov na začiatok bloku #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);

Výsledok vykonania kódu:

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

Príklad

Použime ako parameter metódy reťazec:

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

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

Výsledok vykonania kódu:

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

Pozri tiež

metóda append,
ktorá vkladá elementy na koniec
metóda appendChild,
ktorá vkladá elementy na koniec
metóda insertBefore,
ktorá vkladá element pred element
metóda insertAdjacentElement,
ktorá vkladá element na určené miesto
metóda insertAdjacentHTML,
ktorá vkladá značky na určené miesto