I get this script error “Invalid argument” when using appendChild(). When in Microsoft Visual Studio Debugger I see “htmlfile: Invalid argument”, and the line it blows up on is t.appendChild(n);

The div I want to append the child div to is the top most div in the dom.
Anyone see what I am doing wrong here?

var t = document.parentWindow.parent.parent.document.getElementById("mod"); 
var n = document.createElement("div");
n.setAttribute("id", "c_dlg"); 
t.appendChild(n);

Thanks

Dani AI

Generated

The "htmlfile: Invalid argument" on the line that calls appendChild usually means the node being appended does not belong to the same Document as the container. In this thread showed the target coming from a parent document while the new node was created in the current document; that mismatch is precisely what pointed out, and explains why and reported the same fix worked for them.

Diagnostics (short checklist):

  • Confirm the container exists and is an Element (nodeType === 1).
  • Compare the documents: verify n.ownerDocument === t.ownerDocument.
  • If the ownerDocument values differ, create the new node in the container’s document or import the node into that document.
  • Remember older IE quirks: certain elements (table/row/cell) must be created in the correct parent context.

Practical approaches (examples):

// assume 'target' is the element that lives in the parent/frame document
var tgtDoc = target && target.ownerDocument ? target.ownerDocument : document;
var newDiv = tgtDoc.createElement('div');
newDiv.id = 'c_dlg';
target.appendChild(newDiv);

If an existing node from another document must be moved, import it first:

if (target.ownerDocument.importNode) {
  var imported = target.ownerDocument.importNode(sourceNode, true);
  target.appendChild(imported);
}

A final caution: cross-origin frames will block access to their document (same-origin policy) and will raise different errors. The suggestion by to create elements in the same document is the simplest, most robust fix for the "Invalid argument" appendChild failure.

Recommended Answers

All 4 Replies

Could you post the corresponding HTML code?

Member Avatar for Member #185203

This is late reply to this post but it might help someone searching with this problem.

I found that creating the new element within the same document I needed to append to fixed a similar problem I was having.

So in this case creating the new div like this may be a fix for this problem:

document.parentWindow.parent.parent.document.createElement("div");

Hope this helps someone.

This is late reply to this post but it might help someone searching with this problem.

I found that creating the new element within the same document I needed to append to fixed a similar problem I was having.

So in this case creating the new div like this may be a fix for this problem:

document.parentWindow.parent.parent.document.createElement("div");

Hope this helps someone.

This solved my problem, thanks!

This is late reply to this post but it might help someone searching with this problem.

I found that creating the new element within the same document I needed to append to fixed a similar problem I was having.

So in this case creating the new div like this may be a fix for this problem:

document.parentWindow.parent.parent.document.createElement("div");

Hope this helps someone.

After a long search, i got this post and my problem is solved.

Thanks,
Suresh
<FAKE SIGNATURE>

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.