JavaScript で特定の要素の直後に新しい要素を挿入する

published:

JavaScript で、 insertAdjacentElement メソッドを利用して、特定の要素のすぐ後に新しい要素を挿入する。

insertAdjacentElement メソッドは、第一引数に挿入位置を、第二引数に Element を指定する。
特定の要素の直後に新しい要素を挿入する場合は、第一引数に文字列 'afterend' を指定する。

HTML

<p id="example">サンプルテキスト</p>

JavaScript

var p1 = document.getElementById('example');
var p2 = document.createElement('p');
var content = document.createTextNode('直後に挿入されるテキスト');
p2.appendChild(content);
p1.insertAdjacentElement('afterend', p2);

Previous Article

Next Article