Element.insertAdjacentHTML()

insertAdjacentHTML() metoda z Element interfejsu analizuje specyficzny tekst jak HTML albo XML, wstawia wynik w drzewo DOM w określonej pozycji. to nie naprawia elementu jest użyty na a zatem nie jest zepsuty istniejący element w środku elementu. To unika ekstra kroków z serializacją, zrobienie tego jest wiele szybsze niż bezpośredni innerHTML manipulation.

Syntax

element.insertAdjacentHTML(position, text);

Parametry

position
A DOMString (en-US) reprezentuje pozycję relatywną element-u musi być must be jeden z następujących ciągów:
  • 'beforebegin': przed element -em.
  • 'afterbegin': W środku element-u przed jego pierwszym dzieckiem.
  • 'beforeend': W środku elementu po jego ostatnim dziecku.
  • 'afterend': Po element-cie 
text
string analizuje HTML albo XML i włącza w drzewo.

Visualization of position names

<!-- beforebegin -->
<p>
  <!-- afterbegin -->
  foo
  <!-- beforeend -->
</p>
<!-- afterend -->
Note: beforebegin i afterend pozycja działa tylko jeśli node jest w drzewie DOM i ma rodzica elementu.

Przykład:

// <div id="one">one</div>
var d1 = document.getElementById('one');
d1.insertAdjacentHTML('afterend', '<div id="two">two</div>');

// At this point, the new structure is:
// <div id="one">one</div><div id="two">two</div>

Notes

Security considerations

When inserting HTML into a page by using insertAdjacentHTML(), be careful not to use user input that hasn't been escaped.

It is not recommended you use insertAdjacentHTML() when inserting plain text; instead, use the Node.textContent property or the Element.insertAdjacentText() (en-US) method. This doesn't interpret the passed content as HTML, but instead inserts it as raw text.

Specification

Browser compatibility

BCD tables only load in the browser

See also