insertAdjacentElement Metody

insertAdjacentElement metody sahypanyň islendik ýerine element goýup bermäge mümkinçilik berýär. Köp halatlarda createElement kömegi bilen döredilen elementden soň ulanylýar. Kod esasy elemente garanyňda goýulýar. Esasy elementden öň (goýuş usuly beforeBegin), ondan soň (goýuş usuly afterEnd), şeýle hem esasy elementüň başynda (goýuş usuly afterBegin) ýa-da soňunda (goýuş usuly beforeEnd) goýup bolýar.

Sintaksis

esasy element.insertAdjacentElement(goýuş usuly, goýuljak kod);

Mysal . `beforeBegin` Usuly

Esasy elementiň #target element bolsun diýeliň. Ondan öň täze abzas goýalyň:

<div id="target">
	<p>element</p>
</div>

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

let target = document.querySelector('#target');
target.insertAdjacentElement('beforeBegin', p);

Kodyň netijesi:

<p>!</p>
<div id="target">
	<p>element</p>
</div>

Mysal . `afterEnd` Usuly

Indi bolsa esasy elementden soň täze abzas goýalyň:

<div id="target">
	<p>element</p>
</div>

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

let target = document.querySelector('#target');
target.insertAdjacentElement('afterEnd', p);

Kodyň netijesi:

<div id="target">
	<p>element</p>
</div>
<p>!</p>

Mysal . `afterBegin` Usuly

Esasy elementüň başyna täze abzas goýalyň:

<div id="target">
	<p>element</p>
</div>

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

let target = document.querySelector('#target');
target.insertAdjacentElement('afterBegin', p);

Kodyň netijesi:

<div id="target">
	<p>!</p>
	<p>element</p>
</div>

Mysal . `beforeEnd` Usuly

Esasy elementüň soňuna täze abzas goýalyň:

<div id="target">
	<p>element</p>
</div>

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

let target = document.querySelector('#target');
target.insertAdjacentElement('beforeEnd', p);

Kodyň netijesi:

<div id="target">
	<p>element</p>
	<p>!</p>
</div>

Şeýle-de görüň

insertAdjacentHTML metodu,
bellenilen ýere tegleri goýýar
insertAdjacentText metodu,
bellenilen ýere tekst goýýar
prepend metodu,
elementleri başa goýýar
append metodu,
elementleri soňa goýýar
appendChild metodu,
elementleri ata-enäniň soňuna goýýar
insertBefore metodu,
elementleri elementden öň goýýar

insertAdjacentElement Metody

Sintaksis

Mysal . beforeBegin Usuly

Mysal . afterEnd Usuly

Mysal . afterBegin Usuly

Mysal . beforeEnd Usuly

Şeýle-de görüň

Mysal . `beforeBegin` Usuly

Mysal . `afterEnd` Usuly

Mysal . `afterBegin` Usuly

Mysal . `beforeEnd` Usuly