前端调试方法

1、用谷歌浏览器打开项目文件页面

2、F12(一些电脑可能要按住Fn+F12) 或 右上角的自定义及控制->更多工具->开发者工具，打开浏览器的调试工具，如图所示。

3、HTML及CSS调试，如图所示。

左边为HTML标签模块，右边为CSS样式模块。

4、JavaScript（JS）调试，如图所示。

选择Sources,打开JS文件（如果JS文件找不到，点击小图标按钮打开项目目录，双击打开JS文件） 在JS代码序号上点击（如代码23行）设置断点，刷新页面，会显示 Paused in debugger ，一步一步执行代码鼠标点击变量即显示当前运行过程中的赋值。

5、也可以通过代码段中添加 Console.log() 方法对JS变量进行显示赋值。（括号内可以是变量，数组等，也可以是字符串，但是字符串需带上引号）

执行页面后在 Console 页签中查看值。