Document.insertBefore throws an error

Question

I have this piece of code:

  <textarea id="test" style="width: 400px; height: 100px"></textarea>
  <script>
    var inserting = document.createElement("div");
    document.insertBefore(inserting,document.getElementById("test"));
  </script>

What should insert DIV id=insertingbefore textarea id=test, but this error occurs

Node was not found" code: "8

I am using FireFox 3.6 with Firebug on WinXP. Where is the problem?

Answer 1

insertBefore it is necessary to call the parent element of the element before which it is inserted:

<textarea id="test" style="width: 400px; height: 100px"></textarea>
  <script>
    var inserting = document.createElement("div");
    var insertAt = document.getElementById("test");
    insertAt.parentNode.insertBefore(inserting,insertAt);
  </script>

Answer 2

.insertBefore()must be called in the DOM node. documentnot a DOM node. Try using the parent node of your text box.

Answer 3

, insertBefore <textarea> node. API Node.insertBefore:

node node.

var insertedElement = parentElement.insertBefore(newElement, referenceElement);

referenceElement null, newElement .

• insertedElement node, newElement
• parentElement node.
• newElement node.
• referenceElement node, newElement.

, - :

parent_element_goes_here.insertBefore(inserting,document.getElementById("test"));

:

document.insertBefore(inserting,document.getElementById("test"));

---

, DOM. DOM window.onload. MDC:

. DOM, .

:

window.onload=function(){
    ...
}

Answer 4

node document.body not document:

document.body.insertBefore(inserting, document.getElementById("test"));