This error might be thrown by IE in multiple situations. This small article is focused on the window.open/appendChild situation. When I looked online for a solution it took me half a day to understand it, I'm sure it will eventually help someone.
You are using window.open() to get access to a window and expect to alter the DOM of this new window from the originating page. This works in all browser beside IE, which complains about an "Interface not supported". Now if you want to know why you would want to update the DOM of window opened in JS, read on, if you already identified your issue and want a solution, skip to the next part "solution".
The main reason why I open windows without an URL and alter their document with JavaScript is speed. In a framework purely in JS, loading the full framework/stack in a new window has a cost. If you wonder how to do that, look at the example at the bottom of the page, you need to write a tiny DOM and close() it before accessing it.
Internet Exploder seems to have issues using appendChild or any DOM altering function mixing elements from different documents. Here is an example that would typically cause this error (click here to test):
var win = window.open("", "stuff", "height=300,width=400,resizable=yes,location=no");
var el = document.createElement("div");
el.innerHTML = "This works!";
win.document.body.appendChild(el);
Another thing IE doesn't like is creating elements in a window without a DOM. Firefox will automatically create a body and everything it needs. The solution to this issue is to create all the elements AND EVENTS using the new window and not the original one. If you have a complex framework this means you will have to carry around the window/document on all your instances (yay!). Here is a piece of code that might help you visualize the solution (click here to test):
var win = window.open("", "test2", "height=300,width=400,resizable=yes,location=no");
win.document.writeln("<html><head><title>IE Compatible</title></head><body> </body></html>");
win.document.close();
setTimeout(function() {
var el = win.document.createElement("div");
el.innerHTML = "<h1>This works in IE too!</h1>";
win.document.body.appendChild(el);
}, 40);
Most JS framework already have a solution to this issue. Some will have a global variable carrying the current document all the time to avoid passing it along, some other make it implicit in their API.
According to the below comments and emails I received, it appears that some people have been having issues with the above fix and IE8. I have personally tested the following versions, and have found the fix to work properly, so if you have an issue, you're doing it wrong ;)
Last Update: 2009-03-11 · Bertrand Janin <tamentis@neopulsar.org> · Powered by Python & Debian GNU/Linux