在单页应用程序中调试JavaScript

Question

In a single page application, I load a different html page with jquery.

$('#lodger').click(function () {
    $('#main').load('lodger.html');
});

In my page lodger.html, I have some javascript directly in the page.

Is there a way to debug it? I haven't found a way to do it with Chrome

Answer 1

The chrome website explains how to debug pretty well:

https://developer.chrome.com/devtools/docs/javascript-debugging

I would refrain from using debugger; . Sooner or later you're going to accidentally leave this bit of code in your script and it'll start pausing your website for users who have dev tools open. Can be very embarrassing.

Answer 2

You can use debugger; notation inside your inline code, and, having DevTools opened these breakpoints will automatically be hit:

$('#lodger').click(function () {
    debugger;
    $('#main').load('lodger.html');
});