Chrome浏览器的F12调试工具

Chrome浏览器的F12调试工具

基本用到的就是 console（控制台） 和 network（网络）

1、network

（1）all ：查看所有的请求

（2）XHR ：查看ajax请求

（3）JS、CSS、img ：请求服务器的资源文件

（4）其中勾选 disable cache ：表清除缓存请求，意思是说，若不勾选的话，本地客户端是有缓存存在的。所有一般开发是尽可能的多响应最新页面加载

（5） headers ：表示这个请求的所有信息，包括请求头部消息，请求格式，请求参数。

（6）其中 XMLHttpRequest ：这个类就是ajax请求类，所有的ajax操作都必须是这个类才能请求，且不论是哪种浏览器

（7）preview ：返回的是请求结果

1. Console

1. console.log() ：弹出打印消息
2. 调试JS方案一：debugger模式

     打断点，浏览器运行到端点处，会进行拦截，断点之后，右边的值可以取到，左边的值不能。

1. 调试JS方案二：在代码出增加debugger

     即在代码处添加debugger，然后用console.log(r.menuList)，则会打印处r.menuList的结果