Element.insertAdjacentText()

Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

The insertAdjacentText() метод помещает заданный текстовый узел в указанную позицию относительно элемента, который передан в вызове метода.

Syntax

element.insertAdjacentText(position, element);

Parameters

position
DOMString позиция для вставки текста относительно элемента  element; должна быть указана в следующем виде:
  • 'beforebegin': Перед самим element.
  • 'afterbegin': Внутри самого element, перед первым child.
  • 'beforeend': Внутри самого element, после последнего child.
  • 'afterend': После самого element.
element
DOMString текст, который будет помещен в заданную позицию.

Return value

Void.

Exceptions

Exception Explanation
SyntaxError Указанная position не может быть распознана.

Visualization of position names

<!-- beforebegin -->
<p>
<!-- afterbegin -->
foo
<!-- beforeend -->
</p>
<!-- afterend -->
Note: The beforebegin and afterend positions work only if the node is in a tree and has an element parent.

Example

beforeBtn.addEventListener('click', function() {
  para.insertAdjacentText('afterbegin',textInput.value);
});

afterBtn.addEventListener('click', function() {
  para.insertAdjacentText('beforeend',textInput.value);
});

Посмотрите пример insertAdjacentText.html на GitHub (исходный код source code.)  Вы можете ввести любой текст в поле формы, а затем нажать кнопки Insert before (вставить до) и Insert after (вставить после) для размещения этого текста до или после существующего абзаца, используя insertAdjacentText(). Обратите внимание, что существующий текстовой узел не изменился, а произошло добавление новых текстовых узлов.

Polyfill

Можно создать polyfill для insertAdjacentText() method который будет работать в Internet Explorer 5.5 (возможно и в более ранних версиях) и последующих версиях, с помощью данного кода:

if (!Element.prototype.insertAdjacentText)
  Element.prototype.insertAdjacentText = function(type, txt){
    this.insertAdjacentHTML(
      type,
      (txt+'') // convert to string
        .replace(/&/g, '&amp;') // embed ampersand symbols
        .replace(/</g, '&lt;') // embed greater than symbols
    )
  }

Specification

Specification Status Comment
DOM
Определение 'insertAdjacentText()' в этой спецификации.
Живой стандарт  

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Да) 48.0 (48.0) ? (Да) (Да)
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support ? 48.0 (48.0) ? ? ?

See also

Метки документа и участники

 Внесли вклад в эту страницу: dedotmoroz
 Обновлялась последний раз: dedotmoroz,