Why can't I see / debug javascript loaded by jquery.html () using Chrome

Question

I load html using inline javascript in the $ .post callback. Something like": -)

callback{ response_data = '<p>string with html and </p><script "javascript">var scripts...</script>' jQuery('#selector').html(response_data); } 

But when I do this, I don’t see the new built-in javascript loaded on the Chrome Scripts tab. I see that JS on the Network tab and js is executing, but I cannot debug this code.

Any idea on how to debug this code? Thanks!

Answer 1

All modern JS engines allow you to generate a javascript breakpoint "in-code".

To do this, you need to execute the debugger; statement debugger; somewhere in your code. As soon as the js engine reads this command, a breakpoint is set and the debugger loads.

You might want to do this. It may still not work correctly, since dynamic script insertion can still be a problem and pain, depending on how and when you do it.

Of course, it would be better to make this more "accurate" by creating and inserting a new script element

 var myscript = document.createElement('script'); myscript.textContent = 'var scripts = 42; alert("hello");'; myscript.type = 'text/javascript'; document.body.appendChild(myscript);