Dynamically adding a script tag to loaded HTML - error in IE7&8

Question

I've been stuck on this for quite a while - any help would be really appreciated.

Basically I'm loading HTML into a page, but the loaded HTML needs to contain an external script in specific position within it. I found the best way to do this was using the following code:

$('#blah').load('blah.htm',
    function(){
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = "[external script url + query string here]";
        $('#blah_blah')[0].appendChild(script);                 
});

Edit: The reasons I'm using "appendChild" instead of jQuery's "append" is that $.append adds the videoplayer created by the script to completely the wrong element. If I use appendChild, it is added to the correct element specified. I think this maybe to do with jQuery's insertion methods, as outlined within this answer: Can't append <script> element

The code I'm using works great in Firefox and Chrome, but in IE7 & 8 I get the error message "Unable to get value of the property 'appendChild': object is null or undefined", and the script tag cannot be seen in the DOM.

If I include the line:

$("#blah_blah")[0].appendChild(document.createTextNode("test"));

the text node "test" is added to the DOM, and can be seen on the page - so it seems "appendChild" does work, but there is an issue with appending a script tag.

Could it possibly be an IE specific security issue?

The script needs to be in a ceratin place as it is for a third party video service - the video player gets rendered where the script tag is. The reasons for not using jQuery append are in the link provided. — J_P
– J_P, Commented Dec 15, 2011 at 21:48
Thanks for creating the jsfiddle, but it shows the same behaviour - when I call the third party script it works fine in FF, but I get an error in IE. I guess it must a cross domain issue then. — J_P
– J_P, Commented Dec 15, 2011 at 21:58

user626963 · Accepted Answer · 2011-12-15 21:31:40Z

2

What's wrong with:

   $.getScript("script.js");

answered Dec 15, 2011 at 21:31

user626963

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

3 Comments

J_P Over a year ago

The script is for a third party video service, and I need to specify exactly where it goes. If I use $.getScript within some script tags in the HTML where it needs to go, it ends up in completely the wrong place. I think it's something to do with the way jQuery handles and evaluates the external script. This seems to be a related issue: bennadel.com/blog/…

user626963 Over a year ago

Maybe you can reposition it where you need once you get it loaded?

J_P Over a year ago

I'd prefer to get it in the right place to begin with, but I guess that's an option, thanks shaun.

Collectives™ on Stack Overflow

Dynamically adding a script tag to loaded HTML - error in IE7&8

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related