Добавить текст до или после элемента HTML

Если у меня есть HTML-элемент типа <div> с некоторым текстом внутри или другими элементами, я могу добавить до или после этого div некоторые текстовые данные без элемента html, просто текст?

Я бы хотел использовать только чистый Javascript.

Что-то вроде:

<div id="parentDiv">
   my text must be added here
  <div id="childDiv"></div>
</div>

Ответы

Ответ 1

Да, вы можете создать текст node с помощью document.createTextNode('the text')

Затем вы можете вставить его как элемент с помощью appendChild или insertBefore.

Пример, который вставляет текст перед #childDiv:

var text = document.createTextNode('the text');
var child = document.getElementById('childDiv');
child.parentNode.insertBefore(text, child);

Ответ 2

Только для записи:

div.insertAdjacentHTML( 'beforeBegin', yourText );

где div - ваш ребенок-DIV.

Live demo: http://jsfiddle.net/ZkzDk/

Ответ 3

Вы можете добавить текст node. Создайте node - document.createTextNode('text'), а затем вставьте/добавьте/замените - сделайте все, что хотите.

Ответ 4

Что-то вроде этого должно это сделать:

<script type="text/javascript">
  var parent = document.getElementById('parentDiv');
  var sibling = document.getElementById('childDiv');
  var text = document.createTextNode('new text');
  parent.insertBefore(text, sibling);
</script>

Ответ 5

Что касается темы и вопроса пользователей для вставки до или после, вот пример для:

   var text = document.createTextNode("my text must be added here.");
   var childTag = document.getElementById("childDiv");

   childTag.parentNode.insertBefore(text, childTag.nextSibling);

Если у childTag нет ни одного брата и сестры, это нормально, потому что метод insertBefore обрабатывает этот случай и просто добавляет его в качестве последнего дочернего элемента.

Также можно использовать метод appendChild() после создания текста node, а затем добавить childTag через parentNode.