chrome 浏览器（或其他浏览器）的调试工具使用

一、常用的前端调试工具

1、Chrome浏览器的调试工具。
2、火狐浏览器的Firebug插件调试工具。
3、IE的开发人员工具等。

二、Chrome浏览器的调试工具的打开方式

1、在网页任意地方右击，选择检查选项。

2、或者在chrome中找到开发者工具或者使用Ctrl+shift+i打开前端调试工具。

3、使用F12也可以打开调试工具。

三、Elements

用于查看和编辑当前页面中的 HTML 和 CSS 元素

如果想要复制elements里边的代码可以右键Copy，然后点击Copy outerHTML就可以复制成功

四、Network

Network标签页对于分析网站请求的网络情况、查看某一请求的请求头和响应头还有响应内容很有用，特别是在查看Ajax类请求的时候，非常有帮助。注意是在你打开Chrome开发者工具后发起的请求，才会在这里显示的哦。 点击左侧某一个具体去请求URL，可以看到该请求的详细HTTP请求情况
Filter 搜索过滤
Preserve log 可以不覆盖之前的记录
XHR ①ajax请求 ②返回回调函数 ③主要是研究http协议。
五、Sources
js资源页面：这个页面内我们可以找到浏览器页面中的js 源文件，方便我们查看和调试