Anita_Sun

忽略某个脚本或脚本格式 🌈 忽略文件树中的某个脚本或目录 🐾 如需忽略单个脚本或整个目录，请运行以下命令： 在来源 > 网页中，右键点击相应目录或脚本文件。 选择将目录...

浏览文件树 🌈 文件树中由群组创作和部署的文件 🐾 启用分组功能，请启用 三点菜单栏中的 按已编写/已部署分组 选项 使用框架（例如 React 或 Angular）开...

查看当前调用堆栈 🌈 在某行代码上暂停时，使用 Call Stack 窗格查看使您进入此操作的调用堆栈 点击某个条目即可跳转到调用该函数的代码行 重启调用堆栈中的函数（帧...

单步调试代码 🌈 代码暂停后，请一次一个表达式地单步调试，并在此过程中调查控制流和属性值。 跳过代码行 🐾 新建一个 代码段，将下面内容粘贴到工作区。 当在包含与当前问...

使用断点暂停代码 🌈 暂停时检查值 🐾 新建一个 代码段，将下面内容粘贴到工作区。 按下 Ctrl + S 保存代码，之后按下 Ctrl + Enter 执行代码 执行...

概览 🌈 Sources 面板包含三个部分： 包含文件树的 Page 标签页。该页面请求的每个文件都列在此处。 代码编辑器 部分。在 Page 标签页中选择文件后， 相应...

打开控制台 🌈 打开“控制台”面板 🐾 快捷键打开：按 Ctrl + Shift + J 或 Command + Option + J (Mac) 命令菜单打开：首先输...

CSS 网格布局 🌈 探索 CSS 网格 🐾 如果您网页上的某个 HTML 元素应用了 display: grid 或 display: inline-grid，您可以...

查看元素的 CSS 🌈 选择你想要的元素，右键点击检查。打开元素（Elements）面板，可以看到右侧的 Style 窗格。Styles 窗格会列出应用到在 DOM 树 ...

显示或隐藏徽章 🌈 右键点击 DOM 树中的某个元素，然后选择 Badge settings... 勾选徽章旁边的复选框会让相应的在 DOM 树中的标记展示，清除复选框则...

打开“属性”窗格 🌈 在 DOM 树中，选择一个节点 打开 属性 标签页。如果您看不到该标签页，请点击 更多，然后从下拉菜单中选择该标签页 发现自身的属性 🌈 Prop...

打开元素（Elements）面板 🌈 默认打开开发者工具，元素面板会自动打开。还可以在页面任意位置上检查节点，让系统自动打开 Elements 面板 使用命令菜单打开 E...

Hello，大家好呀。在当今移动互联网蓬勃发展的时代，确保网页在移动设备上的完美呈现至关重要。Chrome DevTools 中的 Device Mode（设备模式）功能，...

Hello，这篇文章将带你深入了解 Chrome DevTools 的命令菜单运行命令、快捷键的强大特性。你将学会如何轻松调用命令菜单，通过简洁的指令快速实现各种操作。您也...

Hello，小伙伴们，大家好呀，在这边文章中，咱们会介绍如何对 Chrome 浏览器的开发者工具（DevTools）进行外观设置，以提升用户体验和开发效率，让咱们一起开始...