Element.insertAdjacentText()
insertAdjacentText()
メソッドは、与えられたテキストノードを、メソッドを実行した要素に対する相対的な位置に挿入します。
構文
element.insertAdjacentText(position, element);
パラメーター
返り値
Void。
例外
例外 | 説明 |
---|---|
SyntaxError |
position として指定した文字列が認識できない値だった。 |
ポジション名の視覚的な表現
<!-- beforebegin --> <p> <!-- afterbegin --> foo <!-- beforeend --> </p> <!-- afterend -->
メモ: beforebegin
および afterend
の positions が使えるのは、対象ノードがツリーの中にあって、親要素を持つ時に限られます。
beforeBtn.addEventListener('click', function() {
para.insertAdjacentText('afterbegin',textInput.value);
});
afterBtn.addEventListener('click', function() {
para.insertAdjacentText('beforeend',textInput.value);
});
私たちが GitHub に用意した insertAdjacentText.html デモを見てください。(同時に source code も読んでください。) ここにはシンプルなパラグラフが 1 つあります。フォーム要素に好きなテキストを入力してから、Insert before または Insert after ボタンを押すと、insertAdjacentText()
が、入力したテキストをパラグラフのテキストの前または後に挿入します。すでにあるテキストノードにテキストが追加されるのではなく、新しい追加テキストが含まれる別のテキストノードが生成されて、それが追加されることに注意してください。
仕様
Specification |
---|
DOM Standard # dom-element-insertadjacenttext |
ブラウザー間の互換性
BCD tables only load in the browser