0

I came across this case while trying to dynamicly load a bunch of script files, and where I was getting no errors returned when the JavaScript was failing. This will hopefully save someone a lot of time.

How do I enable chrome debugging when inserting a script tag into the head using jquery. This does not allow for debugging (no errors are returned).

$(function(){    
    $('head').append('<script type="text/javascript" src="example.js"></script>');
});
Josh Mc
  • 9,911
  • 8
  • 53
  • 66

1 Answers1

1

I found that doing it via standard dom insertion will work.

. Possibly because jquery picks up what your doing and tries to use ajax instead? this doesnt sound right, but it the only thing I can think of.

. Note that it only the $('head').append that causes it to prevent debugging for some reason.

function safeAddScript(url){
    var el=document.createNode('script');
    el.type="text/javascript";
    el.src=url;
    document.getElementsByTagName('head')[0].appendChild(el);
}

$(function(){
    safeAddScript('example.js');
});
Josh Mc
  • 9,911
  • 8
  • 53
  • 66
  • 1
    It is jQuery's script insertion hijack, for safety reasons. It strips out script tags from the string and evaluates the code internally after ajax loading it (much like you thought): http://stackoverflow.com/a/3603496/1217408 – TheZ Aug 15 '12 at 19:36
  • Thanks for the clarification! I think maybe it is the title that prevented me from getting the answer there. – Josh Mc Aug 15 '12 at 23:49