insertAdjacentText մեթոդը

insertAdjacentText մեթոդը թույլ է տալիս տող տեղադրել էջի ցանկացած տեղում: Տողը տեղադրվում է հղումային էլեմենտի նկատմամբ: Կարելի է տեղադրել հղումային էլեմենտից առաջ (տեղադրման եղանակ 'beforeBegin'), նրանից հետո (տեղադրման եղանակ 'afterEnd'), ինչպես նաև հղումային էլեմենտի սկզբում (տեղադրման եղանակ 'afterBegin') կամ վերջում (տեղադրման եղանակ 'beforeEnd'):

Շարահյուսություն

javascriptհղումային էլեմենտ.insertAdjacentText(տեղադրման եղանակ, տեղադրվող տեքստ);

Օրինակ . Տեղադրման եղանակ beforeBegin

Ենթադրենք հղումային էլեմենտը #target էլեմենտն է: Դրանից առաջ տեղադրենք ինչ-որ տեքստ:

html<div id="target">
  <p>էլեմենտ</p>
</div>
javascriptlet target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'տեքստ');

Կոդի կատարման արդյունքը:

htmlտեքստ
<div id="target">
  <p>էլեմենտ</p>
</div>

Օրինակ . Տեղադրման եղանակ afterEnd

Այժմ տեղադրենք նոր պարբերություն հղումային էլեմենտից հետո:

html<div id="target">
  <p>էլեմենտ</p>
</div>
javascriptlet target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'տեքստ');

Կոդի կատարման արդյունքը:

html<div id="target">
  <p>էլեմենտ</p>
</div>
տեքստ

Օրինակ . Տեղադրման եղանակ afterBegin

Տեղադրենք նոր պարբերություն հղումային էլեմենտի սկզբում:

html<div id="target">
  <p>էլեմենտ</p>
</div>
javascriptlet target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'տեքստ');

Կոդի կատարման արդյունքը:

html<div id="target">
  տեքստ
  <p>էլեմենտ</p>
</div>

Օրինակ . Տեղադրման եղանակ beforeEnd

Տեղադրենք նոր պարբերություն հղումային էլեմենտի վերջում:

html<div id="target">
  <p>էլեմենտ</p>
</div>
javascriptlet target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'տեքստ');

Կոդի կատարման արդյունքը:

html<div id="target">
  <p>էլեմենտ</p>
  տեքստ
</div>

Տես նաև

  • insertAdjacentElement մեթոդը,
    որը տեղադրում է էլեմենտ նշված տեղում
  • insertAdjacentHTML մեթոդը,
    որը տեղադրում է կոդ նշված տեղում
  • prepend մեթոդը,
    որը տեղադրում է էլեմենտներ սկզբում
  • append մեթոդը,
    որը տեղադրում է էլեմենտներ վերջում
  • appendChild մեթոդը,
    որը տեղադրում է էլեմենտներ ծնողի վերջում
  • insertBefore մեթոդը,
    որը տեղադրում է էլեմենտներ էլեմենտից առաջ