理解 Chrome 97 开发者工具的新功能

在 Chrome 97 中，开发者工具的新增功能能够帮助开发人员更加高效地进行网站开发和调试，这些新增功能包括：

• 用户交互宏录制 ：该功能允许开发人员录制用户与网页的交互，然后回放该宏以自动化测试或演示。这可以节省开发人员大量的时间，尤其是当他们需要多次重复相同的任务时。
• 开发者工具中的设置也开始支持设备同步 ：该功能允许开发人员在不同的设备上同步开发者工具的设置。这使得开发人员能够在任何地方继续他们的工作，而无需重新配置他们的设置。
• Element 面板编辑 HTML 支持自动补全 ：该功能使开发人员能够在 Element 面板中编辑 HTML 时获得自动补全建议。这可以帮助开发人员更快速、更准确地编写 HTML 代码。

这些新增功能使 Chrome 97 的开发者工具更加强大，并使开发人员能够更加高效地进行网站开发和调试。

下面是这些新增功能的更详细介绍：

用户交互宏录制

用户交互宏录制功能允许开发人员录制用户与网页的交互，然后回放该宏以自动化测试或演示。这可以通过以下步骤来实现：

1. 打开 Chrome 97 浏览器。
2. 按下 Ctrl + Shift + P 键打开命令面板。
3. 在命令面板中输入 record user interactions，然后按回车键。
4. 单击“开始录制”按钮。
5. 与网页进行交互。
6. 单击“停止录制”按钮。

录制完成后，开发人员可以通过以下步骤回放该宏：

1. 打开 Chrome 97 浏览器。
2. 按下 Ctrl + Shift + P 键打开命令面板。
3. 在命令面板中输入 playback user interactions，然后按回车键。
4. 选择要回放的宏，然后单击“播放”按钮。

开发者工具中的设置也开始支持设备同步

开发者工具中的设置也开始支持设备同步功能，允许开发人员在不同的设备上同步开发者工具的设置。这可以通过以下步骤来实现：

1. 在一台设备上打开 Chrome 97 浏览器。
2. 打开开发者工具。
3. 单击齿轮图标打开设置面板。
4. 在“同步”选项卡中，选中“同步开发者工具设置”复选框。
5. 在另一台设备上打开 Chrome 97 浏览器。
6. 打开开发者工具。
7. 单击齿轮图标打开设置面板。
8. 在“同步”选项卡中，选中“同步开发者工具设置”复选框。

同步完成后，开发人员可以在任何设备上继续他们的工作，而无需重新配置他们的设置。

Element 面板编辑 HTML 支持自动补全

Element 面板编辑 HTML 支持自动补全功能使开发人员能够在 Element 面板中编辑 HTML 时获得自动补全建议。这可以通过以下步骤来实现：

1. 在 Chrome 97 浏览器中打开一个网页。
2. 右键单击网页中的某个元素，然后选择“检查”选项。
3. 在打开的开发者工具窗口中，选择“Element”选项卡。
4. 在 HTML 代码中，将光标放在要编辑的元素上。
5. 开始输入 HTML 代码。

当开发人员输入 HTML 代码时，Element 面板将提供自动补全建议。开发人员可以选择这些建议来快速、准确地编写 HTML 代码。

这些新增功能使 Chrome 97 的开发者工具更加强大，并使开发人员能够更加高效地进行网站开发和调试。