最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

internet explorer - <script> inside javascript code document.write() - Stack Overflow

programmeradmin3浏览0评论

I got a portion of javascript code embedded in HTML (generated on the server side) that looks like this:

function winWriteMail2(){
  var win = open('','wininfo', 'width=400,height=300,scrollbars=yes,resizable=yes');
  win.document.open();
  win.document.write('<HTML><HEAD><META http-equiv="Content-type" content="text/html; charset=iso-8859-2"><LINK rel="stylesheet" type="text/css" href="/css/main.css">');
  win.document.write('<scr' + 'ipt language="javascript" type="text/javascript" src="/js/JSFILE.js"></scr' + 'ipt>');
  win.document.write('</HEAD><BODY BGCOLOR="#f7f3e7">');
  <!-- window content goes here -->
  win.document.write('</BODY></HTML>');
  win.document.close();
}

This code gets executed on click of a element.

The problematic part for me is the inclusion of javascript file - it works ok in Firefox and Chrome, but IE (7 and 8, as I tested) behaves strange. With the line containing JSFILE there, the window on click gets opened, but is empty, CPU is 100% busy and only way is to kill IE.

Anyone can help with handling this problem? Maybe I should use some other way to insert the javascript files in there?

I tried, instead of win.document.write(), the DOM-manipulation method, putting this part of code after win.document.close():

h = win.document.getElementsByName('head')[0];
js = document.createElement('script');
js.src = '/js/JSFILE.js';
h.appendChild(js);

but then the code isn't loaded, even in Firefox (and inspecting with firebug doesn't show it even can see it).


After some checks, I found out that the problem is caused by <script> elements with a src= attribute defined. If I add an inline script, like:

<script type='text/javascript'>alert('foo')</script>

within my document.write(), the window opens, the alert box shows up and everything's all right.

But using a

<script type='text/javascript' src='/js/foo.js'></script>

IE stalls when opening the new window, keeps using 100% of CPU.

I got a portion of javascript code embedded in HTML (generated on the server side) that looks like this:

function winWriteMail2(){
  var win = open('','wininfo', 'width=400,height=300,scrollbars=yes,resizable=yes');
  win.document.open();
  win.document.write('<HTML><HEAD><META http-equiv="Content-type" content="text/html; charset=iso-8859-2"><LINK rel="stylesheet" type="text/css" href="/css/main.css">');
  win.document.write('<scr' + 'ipt language="javascript" type="text/javascript" src="/js/JSFILE.js"></scr' + 'ipt>');
  win.document.write('</HEAD><BODY BGCOLOR="#f7f3e7">');
  <!-- window content goes here -->
  win.document.write('</BODY></HTML>');
  win.document.close();
}

This code gets executed on click of a element.

The problematic part for me is the inclusion of javascript file - it works ok in Firefox and Chrome, but IE (7 and 8, as I tested) behaves strange. With the line containing JSFILE there, the window on click gets opened, but is empty, CPU is 100% busy and only way is to kill IE.

Anyone can help with handling this problem? Maybe I should use some other way to insert the javascript files in there?

I tried, instead of win.document.write(), the DOM-manipulation method, putting this part of code after win.document.close():

h = win.document.getElementsByName('head')[0];
js = document.createElement('script');
js.src = '/js/JSFILE.js';
h.appendChild(js);

but then the code isn't loaded, even in Firefox (and inspecting with firebug doesn't show it even can see it).


After some checks, I found out that the problem is caused by <script> elements with a src= attribute defined. If I add an inline script, like:

<script type='text/javascript'>alert('foo')</script>

within my document.write(), the window opens, the alert box shows up and everything's all right.

But using a

<script type='text/javascript' src='/js/foo.js'></script>

IE stalls when opening the new window, keeps using 100% of CPU.

Share Improve this question edited Jan 4, 2010 at 7:20 kender asked Dec 31, 2009 at 13:23 kenderkender 87.1k26 gold badges105 silver badges145 bronze badges 2
  • 3 Side note: A performance boost. Use one write statement instead of multiple. Build the entire HTML string first than write to the window. – epascarello Commented Dec 31, 2009 at 13:58
  • 1 Thanks a lot for the info. Will fix it for sure. – kender Commented Jan 2, 2010 at 12:03
Add a comment  | 

5 Answers 5

Reset to default 6 +150

This code worked for me:

function winWriteMail2(){
    var win = open('','wininfo', 'width=400,height=300,scrollbars=yes,resizable=yes');
    win.document.open();
    win.document.write('<HTML><HEAD><META http-equiv="Content-type" content="text/html; charset=iso-8859-2"><LINK rel="stylesheet" type="text/css" href="/css/main.css">');
    win.document.write('</HEAD><BODY BGCOLOR="#f7f3e7">');
    win.document.write('this is the body content');
    win.document.write('</BODY></HTML>');
    win.document.close();

    var h = win.document.getElementsByTagName("head")[0];
    var js = win.document.createElement("script");
    js.type = "text/javascript";
    js.src = "js/scriptfile.js";
    h.appendChild(js);
}

Here is what I needed to change in your code to make it work:

//From
var js = document.createElement("script");
//To
var js = win.document.createElement("script");

You need to create the script element in the same document that you are appending.

Google Analytics does it this way:

var _gat, gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

Think your DOM-based code is fine, but try to (a) use the absolute script URL, (b) set the script type and (c) update src after appending, this should make it working more reliably:

var head = document.getElementsByTagName("head")[0];
var script = document.createElement("script");
script.type = "text/javascript";
head.appendChild(script);
script.src = "http://host.tld/js/JSFILE.js";

Hope this helps.

EDIT

By the way, it is good idea to set up kind of callback, to make sure script was loaded before using its code. Code can look similarly to this:

// most browsers
script.onload = callback;
// IE
script.onreadystatechange = function() {
   if(this.readyState == "loaded"  || this.readyState == "complete") {
      callback();
   }
}

Here callback is literally the function to execute.

Have a look at writeCapture.js

Utility to assist the Ajax loading of HTML containing script tags that use document.write

i know this is a 4 y/o thread, but I wanted to add a fix I just combined via a few different articles/questions:

rather than appending the documents (.css, .js, etc) after the document.write call, I altered my open call to look like:

var win = window.open("//"+document.domain, "_blank");//document.domain is the fix
if(win != null)
    win.document.write('...');//insert your content, wherever you got it (hand-coded, ajax, etc)

adding '//' will automatically set the protocol (http vs https) and document.domain = well, your domain. essentially, this sets the address bar correctly in IE so that using /foo/bar.js type src's and href's will be located and work correctly.

hope this helps someone! :P

发布评论

评论列表(0)

  1. 暂无评论