zl程序教程

您现在的位置是:首页 >  Java

当前栏目

前端小技能:Chrome DevTools中的操作技巧

2023-02-18 16:34:23 时间

前言

Mac 使用 command+option+I 即可打开DevTools

I 操作技巧

1.1 编辑页面上的任何文本 ✍

在控制台输入document.body.contentEditable="true"开启文本编辑模式,刷新网页可自动退出模式了。

或者document.designMode = 'on'就可以实现对网页的编辑了。

在这里插入图片描述

如果你想快速修改一些网页数据,使用这个是最方便的,比什么P图软件都快。

在这里插入图片描述

1.2 清空缓存并硬性重新加载

chrome浏览器使用快捷键option+command+i打开开发模式,如果在地址栏右侧的刷新按钮右键选择清空缓存并硬性重新加载

1.3 Command 菜单

Cmd + Shift + P

在这里插入图片描述

截图包含滚动条在内的所有页面内容

Capture full size screenshot(并不只是页面可视区域)

see aslo

  • html进阶:【Meta 标签的 http-equiv 属性使用指南】

https://kunnan.blog.csdn.net/article/details/108941030