insertAdjacentElement մեթոդը
insertAdjacentElement մեթոդը թույլ է տալիս
ներդնել տարր էջի ցանկացած տեղում:
Ամենից հաճախ օգտագործվում է տարր ստեղծելուց հետո
createElement-ի օգնությամբ:
Կոդը ներդրվում է հղումային տարրի նկատմամբ:
Կարելի է ներդնել հղումային տարրից առաջ
(ներդրման եղանակը beforeBegin),
նրանից հետո (ներդրման եղանակը afterEnd),
ինչպես նաև հղումային տարրի սկզբում (ներդրման եղանակը afterBegin)
կամ վերջում (ներդրման եղանակը beforeEnd):
Շարահյուսություն
հղումային տարր.insertAdjacentElement(ներդրման եղանակ, ներդրման կոդ);
Օրինակ . beforeBegin եղանակը
Ենթադրենք հղումային տարրը #target տարրն է:
Ներդնենք նոր պարբերություն դրանից առաջ.
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('beforeBegin', p);
Կոդի կատարման արդյունք.
<p>!</p>
<div id="target">
<p>elem</p>
</div>
Օրինակ . afterEnd եղանակը
Այժմ ներդնենք նոր պարբերություն հղումային տարրից հետո.
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('afterEnd', p);
Կոդի կատարման արդյունք.
<div id="target">
<p>elem</p>
</div>
<p>!</p>
Օրինակ . afterBegin եղանակը
Ներդնենք նոր պարբերություն հղումային տարրի սկզբում.
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('afterBegin', p);
Կոդի կատարման արդյունք.
<div id="target">
<p>!</p>
<p>elem</p>
</div>
Օրինակ . beforeEnd եղանակը
Ներդնենք նոր պարբերություն հղումային տարրի վերջում.
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('beforeEnd', p);
Կոդի կատարման արդյունք.
<div id="target">
<p>elem</p>
<p>!</p>
</div>
Տես նաև
-
insertAdjacentHTMLմեթոդը,
որը ներդնում է թեգերը նշված տեղում -
insertAdjacentTextմեթոդը,
որը ներդնում է տեքստը նշված տեղում -
prependմեթոդը,
որը ներդնում է տարրերը սկզբում -
appendմեթոդը,
որը ներդնում է տարրերը վերջում -
appendChildմեթոդը,
որը ներդնում է տարրերը ծնողի վերջում -
insertBeforeմեթոդը,
որը ներդնում է տարրերը տարրից առաջ