1

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?

Community
  • 1
  • 1
J_P
  • 599
  • 1
  • 9
  • 20
  • Why does the script need to be in a specific position? – FishBasketGordo Dec 15 '11 at 21:29
  • Try append http://stackoverflow.com/questions/610995/jquery-cant-append-script-element – Alfabravo Dec 15 '11 at 21:40
  • No repro. It is working for me... http://jsfiddle.net/QKM2D/ – Merlyn Morgan-Graham Dec 15 '11 at 21:44
  • 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 Dec 15 '11 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 Dec 15 '11 at 21:58

1 Answers1

2

What's wrong with:

   $.getScript("script.js");
  • 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: http://www.bennadel.com/blog/1605-jQuery-AJAX-Strips-Script-Tags-And-Inserts-Them-After-Parent-Most-Elements.htm – J_P Dec 15 '11 at 21:46
  • Maybe you can reposition it where you need once you get it loaded? –  Dec 15 '11 at 21:56
  • I'd prefer to get it in the right place to begin with, but I guess that's an option, thanks shaun. – J_P Dec 15 '11 at 22:15