谷歌浏览器开发者工具可通过五种方式打开:一、快捷键Ctrl+Shift+I(Win/Linux)或Cmd+Option+I(macOS);二、右键选“检查”;三、菜单栏“更多工具→开发者工具”;四、快捷键Ctrl+Shift+J(Win/Linux)或Cmd+Option+J(macOS)直开控制台;五、地址栏输入chrome://inspect调试远程设备。

如果您需要调试网页代码、查看网络请求或修改页面样式,谷歌浏览器开发者工具是必不可少的调试利器。以下是打开并使用谷歌浏览器控制台的具体操作方法:
一、通过快捷键打开开发者工具
快捷键方式是最快速、最常用的开启途径,适用于 Windows、Linux 及 macOS 系统(部分按键略有差异)。
1、在谷歌浏览器中打开任意网页。
2、按下 Ctrl + Shift + I(Windows/Linux)或 Cmd + Option + I(macOS)。
3、开发者工具面板将立即在页面右侧或底部展开,默认聚焦于“元素”(Elements)标签页。
二、通过鼠标右键菜单打开
该方法无需记忆快捷键,适合初学者快速定位调试入口,且始终作用于当前选中元素。
1、在网页任意位置点击鼠标右键。
2、在弹出的上下文菜单中选择 检查(Inspect)选项。
3、开发者工具随即打开,并自动高亮显示右键点击处对应的 HTML 元素。
三、通过浏览器菜单栏打开
该方式路径明确、稳定可靠,适用于快捷键被禁用或系统冲突的场景。
1、点击浏览器右上角的三点竖排图标(更多操作按钮)。
2、依次选择 更多工具 → 开发者工具。
3、开发者工具窗口以独立面板形式出现,初始默认为“元素”视图。
四、通过地址栏命令打开控制台
此方法可直接跳转至“控制台”(Console)标签页,省去手动切换步骤,适合执行 JavaScript 脚本调试。
1、确保开发者工具已处于开启状态(可先用任一前述方式打开后关闭亦可)。
2、再次按下 Ctrl + Shift + J(Windows/Linux)或 Cmd + Option + J(macOS)。
3、控制台(Console)标签页将被激活,光标自动置于输入框内,可立即输入并执行 JS 命令。
五、通过地址栏输入 chrome://inspect 打开远程调试界面
该方式用于连接并调试移动设备网页、PWA 应用或远程标签页,需提前启用对应功能。
1、在谷歌浏览器地址栏中输入 chrome://inspect 并按回车。
2、页面加载完成后,勾选 配置 中的 发现网络目标 选项。
3、若已连接支持调试的安卓设备或开启远程调试的 Chrome 实例,其标签页将列于 远程目标 区域下方,点击 inspect 即可打开对应控制台。











