
1. 打开Chrome浏览器并访问你的网站。
2. 在地址栏中输入`chrome://inspect`(Windows)或`chrome://inspect/devices`(Mac),然后按回车键。这将打开开发者工具的URL。
3. 点击“检查”按钮,或者按F12键(Windows)或Cmd+Option+I(Mac)。这将加载你的网页到开发者工具中。
4. 在开发者工具中,你将看到一个包含多个选项卡的窗口。每个选项卡代表一个不同的功能,例如“元素”、“网络”和“控制台”。
5. 要查看网页的源代码,请点击“元素”选项卡。这将显示页面上的所有元素及其属性。
6. 要查看网络请求,请点击“网络”选项卡。这将显示所有HTTP请求,包括请求类型、请求头、响应状态等。
7. 要查看控制台输出,请点击“控制台”选项卡。这将显示控制台日志,你可以在这里执行JavaScript代码。
8. 要保存网页,请点击“文件”菜单,然后选择“另存为”或“下载”。这将保存当前页面的HTML代码。
9. 要刷新页面,请点击“控制台”选项卡,然后输入`document.location = "http://www.example.com"`。这将刷新当前页面到指定的URL。
10. 要退出开发者工具,请点击“文件”菜单,然后选择“退出”。
以上就是使用Google Chrome开发者工具的基本步骤。随着你对开发者工具的熟悉,你可以开始探索更多的功能,如调试、性能分析、安全检查等。





