如何在浏览器中调试JS代码，debug
如何在浏览器中调试JS代码，debug
首先需要一段js代码，我将它放进html文件里面： 创建一个html文件，<script>标签里面放入需要调试的js代码，html文件如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>try</title>
</head>
<body>
</body>
<script>
//以下为一个要调试的代码段，是力扣63. 不同路径 II 的答案，此为示例
var obstacleGrid = [[0, 0, 0], [0, 1, 0], [0, 0, 0]];
var uniquePathsWithObstacles = function (obstacleGrid) {
var m = obstacleGrid.length;
var n = obstacleGrid[0].length;
//dp[i][j] = dp[i-1][j]+dp[i][j-1];
var dp = new Array(m);
for (var i = 0; i < m; i++) {
dp[i] = new Array(n);
}
for (var i = 0; i < m; i++) {
for (var j = 0; j < n; j++) {
dp[i][j] = 0;
}
}
for (var i = 0; i < m && obstacleGrid[i][0] === 0; i++) {
dp[i][0] = 1;
}
for (var j = 0; j < n && obstacleGrid[0][j] === 0; j++) {
dp[0][j] = 1;
}
for (var i = 1; i < m; i++) {
for (var j = 1; j < n; j++) {
if (obstacleGrid[i][j] === 1) {
dp[i][j] = 0;
}
else if (obstacleGrid[i][j] === 0) {
dp[i][j] = dp[i - 1][j] + dp[i][j - 1];
}
}
}
return dp[m - 1][n - 1];
};
uniquePathsWithObstacles(obstacleGrid);
</script>
</html>
我们在浏览器打开这个html文件，推荐谷歌浏览器，在浏览器页面中按下F12键，就能看见下图所示的窗口： 看见图中红色箭头指向的Sources,点它。 如图操作，点击open file，打开你写代码的那个文件，然后鼠标点击代码行前面的数字处就可以设置断点了（不知道断点是什么的请自行搜索）。
设置好断点之后就按下F5键，就能运行程序了，如图红色框框（中间和右面），可以看见各部分变量的值。 然后代码运行到第一个断点处停止，并在右面和界面里显示变量数值，想要继续运行，点击右上方的蓝色小箭头，如图： 然后就是自己看自己的代码啦。 另外除了这种方式也可以用js 的debugger、console.log（）来进行调试辅助，具体的可以自己去搜啦。 over~
