jQuery.load doesn't execute javascript with document.write

Question

I am trying to use jQuery.Load to load an ad call that has a document.write, and for some reason its not able to, or in firefox atleast, reloads the page with the entire ad.

Here is the simplified version of the code.

DynamicLoad.html

<html>
<head>
<script src="http://www.prweekus.com/js/scripts.js?3729212881" type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Load of Script</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
   google.load("jquery", "1.3.2");
</script>
<script type="text/javascript">
   $(document).ready(function(){
    $("#myButton").click(function() {
        $("#myDiv").load("source.html");
    });
   });
</script>
</head>
<body>
<button id="myButton">Click Me</button>
<div id="myDiv"></div>

<div id="slideAdUnit"></div>

</body>
</html>

Source.html

<script language="javascript" type="text/javascript">
  document.write('<script language="javascript" type="text/javascript"><\/script>');
</script>
test

Once you click the button in FF the browser just waits for something to load. Any thoughts ?

Eventually I would be passing a src element in the document.write which points to our ad server.

Thanks for your help.

interjay · Accepted Answer · 2010-04-13 16:44:47Z

5

You can't use document.write after the page has finished loading: it will replace the contents of the page if you do.

The easiest way to load a script dynamically with jQuery is:

$.getScript( url );

Another way is to create a new <script> element and add it to the document.

answered Apr 13, 2010 at 16:44

interjay

111k22 gold badges278 silver badges264 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

noah · Accepted Answer · 2010-06-15 02:59:08Z

1

writeCapture.js (full disclosure: I'm the author) can solve this:

$("#myDiv").writeCapture().load("source.html");

answered Jun 15, 2010 at 2:59

noah

21.6k17 gold badges69 silver badges88 bronze badges

Comments

Diodeus - James MacFarlane · Accepted Answer · 2010-04-13 16:45:55Z

0

You need to insert a script block into the DOM. You can't just write it into the document like that.

Use: $(document.createElement('script'));, then set the attributes you require.

var newBlock = $(document.createElement('script'));
$(newBlock).attr('src','http://...')

answered Apr 13, 2010 at 16:45

Diodeus - James MacFarlane

115k33 gold badges164 silver badges180 bronze badges

Comments

carawan · Accepted Answer · 2011-02-24 20:36:09Z

I found the same issue with IE - it doesn't execute a script loaded using document.write, but creating a script DOM element worked perfectly fine.

In your case, if you have only one script to load in Source.html just modify it to dynamically create script DOM element. It will work in both IE and FF. But if you have multiple script files to load dynamically, you may not be able to use this technique as this technique doesn't guarantee the execution order in IE.

Please go to Google and search for "Even Faster Websites" and you will get a very nice article about dynamic script loading.

By the way, I don't understand why IE doesn't execute script loaded using document.write.

Also my FF waited for something if I use document.write (same thing happened to you!!). I am not sure about the reason and it could be very low-level. So, please just don't use it with FF. If you have already identified the reason, please share.

Collectives™ on Stack Overflow

jQuery.load doesn't execute javascript with document.write

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related