浏览器调试

一、浏览器调试概述

• 通过控制台来检查代码的运行结果

二、打开控制台的方法

方式一、在页面直接f12方式二、在页面右击鼠标点击检查即可(如下图)

图一

三、控制台介绍

一、Elements的作用(查找网页源代码HTML任一元素)

图三

二、Console的作用(记录开发过程中的显示的信息，输出打印日志)

图四

三、Sources的作用(断点调试js)

图五

四、Network的作用(分析HTTP请求后得到的各个请求资源信息包括状态、资源类型、大小可以根据这个进行网络性能优化)

图六

四、使用方法(演示案例)

• 下图为案例

图二

• 一、我们想修改样式就通过控制台找到我们要修改的class名，然后再前端函数里写对应修改的样式即可(