使用 Chrome 自带的替换功能

打开 Chrome 开发者工具，切换到 Network 面板。在请求列表中右键点击 www.baidu.com，选择 Override content

页面上方会出现一个提示栏，点击其中的 Select folder 按钮

在弹出的文件选择器中，选择 桌面 文件夹。随后会弹出一个对话框，询问是否允许开发者工具修改文件，点击 修改文件

Chrome 会自动在桌面创建一个名为 www.baidu.com 的文件夹：

在 index.html 的 head 标签内插入如下代码，并保存文件：

<script src="https://unpkg.com/vconsole/dist/vconsole.min.js"></script>
<script>var vConsole = new VConsole();</script>

返回浏览器并"刷新"百度首页，可以看到页面右下角已经成功出现了 vConsole 调试面板

Select 下拉框的样式调试

调试下拉框样式时，经常会遇到这样的问题：当 Select 下拉内容展开后，一旦切换到浏览器 DevTools 面板，下拉内容就会自动收起，无法继续选中或查看相关样式。

解决方法是打开 DevTools 的 More tools 菜单，选择 Rendering

在打开的 Rendering 面板中，勾选 Emulate a focused page