javascript - appendChild not working with window.open in IE

I have a page with an svg tag. The page has a button called "Preview" which on clicking should open a new window with the image (svg).

Below is a piece of code which works in Chrome/Firefox but not in IE (I'm using IE 9- IE9 standards mode)

var w = window.open();
var svg = $('#chart');              
var svgPrint = svg.cloneNode(true);
svgPrint.setAttribute('xmlns','');
w.document.body.appendChild(svgPrint);

Any suggestions would be highly appreciated.

Thanks.

I have a page with an svg tag. The page has a button called "Preview" which on clicking should open a new window with the image (svg).

Below is a piece of code which works in Chrome/Firefox but not in IE (I'm using IE 9- IE9 standards mode)

var w = window.open();
var svg = $('#chart');              
var svgPrint = svg.cloneNode(true);
svgPrint.setAttribute('xmlns','http://www.w3.org/2000/svg');
w.document.body.appendChild(svgPrint);

Any suggestions would be highly appreciated.

Thanks.

Share Improve this question edited Jun 10, 2013 at 6:13 asked Jun 10, 2013 at 6:02 ria 7,97412 gold badges42 silver badges46 bronze badges

I suppose about:blank is run in Quirks mode, which doesn't support svg. – Teemu Commented Jun 10, 2013 at 6:07
@Teemu It is being run in IE9 standards mode... – ria Commented Jun 10, 2013 at 6:12
Yes, your main page is, but the window you open is more likely to run in Quirks mode, since it doesn't have a doctype declaration... Just test it by opening a real document in it. – Teemu Commented Jun 10, 2013 at 6:14
@Teemu The above code doesn't work for other html elements also.. :( I tried opening new window with a html div which contains just a Text. Even that doesn't work.. I get a blank page. – ria Commented Jun 10, 2013 at 8:19
Weird, IE throws SCRIPT5022 error (Exception thrown and not caught). But this code has nothing to do with try..catch ?! Also loading a real page to a newly opened window doesn't remove this error. Setting w.document.body.innerHTML = '...' seems to work. When enclosing appendChild() within try..catch, the error message is HierarchyRequestError, which means, that "The node cannot be inserted at the requested location." This smells a big bug in IE... – Teemu Commented Jun 10, 2013 at 9:29

| Show 1 more comment

2 Answers 2

Sorted by: Reset to default 14

IE will block appending any element created in a different window context from the window context that the element is being appending to.

var childWindow = window.open('somepage.html');

//will throw the exception in IE
childWindow.document.body.appendChild(document.createElement('div'));

//will not throw exception in IE
childWindow.document.body.appendChild(childWindow.document.createElement('div'));

After dealing with the same issue, this is an excerpt of the solution that worked in my case for IE, avoiding the SCRIPT5022 error. Thanks to help from this post.

var myWindow = window.open('about:blank', 'loading...', '');
var myWindowDoc = myWindow.document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'html', null);
var myWindowBody = myWindow.document.createElementNS('http://www.w3.org/1999/xhtml', 'body');

myWindow.document.open().write('<html><head></head><body><div id="targetDiv"></div></body></html>');
myWindow.document.close();

try {
    myWindow.document.getElementById('targetDiv').appendChild(HTMLpayload.cloneNode(true)); 
} catch (e){
    if (HTMLpayload.outerHTML) {
        myWindow.document.getElementById('targetDiv').innerHTML = HTMLpayload.outerHTML;
    } else {
        console.log(e);
    }
}

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - appendChild not working with window.open in IE - Stack Overflow

2 Answers 2

与本文相关的文章

评论列表(0)