JavaScript 第二章(chrome浏览器开发工具简介)

77 阅读1分钟

我们学习JavaScript,最终代码运行在浏览器端,那么就需要我们熟练使用浏览器的开发者工具进行调试,这里以chrome浏览器的开发者工具为例:

点击在这里插入图片描述图标可以快速选择DOM节点 在这里插入图片描述 点击在这里插入图片描述图标可以模拟设备尺寸 在这里插入图片描述

一、元素

可以查看DOM节点,以及选中的DOM节点对应的样式 在这里插入图片描述 在这里也可以更改节点内容以及样式内容

二、控制台

在控制台,我们可以输入JavaScript代码来执行 在这里插入图片描述

三、源代码

在源代码,可以打断点调试 在这里插入图片描述

四、网络

在网络,可以模拟网速 在这里插入图片描述 可以查看网络请求,但是不能改变网络请求 在这里插入图片描述

应用

在应用,可以看到cookie、local storage、session storage等 存在浏览器中的值 在这里插入图片描述