insertAdjacentHTML

insertAdjacentHTML()は、テキストを DOM ツリー内の指定された位置に挿入する。このinsertAdjacentHTMLを使えば挿入先の要素内に在る、既存の要素や要素内部の破壊を伴わない。既存要素を代入するテキストに加わえるステップを回避できる分、innerHTMLの代入操作より簡潔になる。

構文

element.insertAdjacentHTML(position, text);

position には element に対する相対位置を、以下に示す文字列の1つで指定する。

‘beforebegin’
element の直前に挿入
‘afterbegin’
element 内部の、最初の子要素の前に挿入
‘beforeend’
element 内部の、最後の子要素の後に挿入
‘afterend’
element の直後に挿入

textにはDOMツリーに挿入するHTMLコードを含む文字列を指定する。

注記: beforebegin および afterend の位置指定で動作するのは、ノードがツリー内にあり、かつ親要素が存在する場合のみとなる。