必须同时开启Mac Safari的“开发”菜单和iOS的“Web检查器”开关才能调试：1. Mac端在Safari偏好设置→高级中勾选“在菜单栏中显示‘开发’菜单”；2. iOS端在设置→Safari→高级中开启“Web检查器”。
你需要在 Mac 上实时查看并修改 iPhone Safari 中打开的网页 DOM 结构、控制台日志或网络请求，但 Safari 顶部菜单栏里找不到“开发”选项，设备列表也始终为空——这说明 macOS 和 iOS 两端的调试通道尚未打通，必须同步完成两处关键开关设置才能建立连接。
在 Mac 的 Safari 中启用“开发”菜单
这一步是整个调试流程的入口前提，没有它，“开发”菜单根本不会出现在菜单栏，后续所有设备识别和检查器调用都无从谈起。
1、点击屏幕左上角 Safari → 偏好设置（macOS Sequoia 及更新系统中显示为“设置”）。
2、切换到“高级”标签页，向下滚动到底部。
立即学习“前端免费学习笔记（深入）”；
3、勾选【在菜单栏中显示“开发”菜单】。这个选项一旦启用，Safari 重启后菜单栏就会在“书签”右侧固定出现“开发”项。
4、关闭设置窗口，确认“开发”已出现在菜单栏中。如果没看到，请检查是否误点了其他标签页，或系统语言设置导致选项文字被截断。
在 iOS 设备上开启 Web 检查器
仅 Mac 端开启还不够，iOS 必须主动授权 Web 检查器服务运行，否则 Mac 根本无法发现该设备，更别提列出其打开的网页标签页。
方法一：直接路径操作
进入 iPhone 或 iPad 的“设置”→“Safari 浏览器”→“高级”，将【Web 检查器】开关置为开启（绿色）。
方法二：快捷搜索直达
在设置首页顶部搜索框输入“web 检查器”，系统会直接定位到该开关，点击开启即可。
⚠️ 注意：此设置仅对 Safari 浏览器内打开的网页生效；若网页是嵌入在 App 的 WebView 中，则需开发者额外启用 WebKit 调试支持，本设置无效。
建立连接并启动 Web 检查器
两端设置就绪后，连接与调试需严格遵循物理连接→页面加载→菜单选取的顺序，任意环节错位都会导致目标网页不出现。
第一步：用 USB 数据线将 iOS 设备连接至 Mac，并在 iOS 弹出“信任此电脑？”提示时点击“信任”。
第二步：在 iOS 设备上，用 Safari 打开你要调试的目标网页，确保该标签页处于前台激活状态（非后台、未被切换走）。
第三步：回到 Mac，打开 Safari，点击顶部菜单栏“开发”→悬停在你的设备名称上→在子菜单中找到对应网页标题，点击它。
第四步：Web 检查器面板自动弹出，默认停留在“元素”标签页。点击左上角选择图标（箭头+方框），即可在 iPhone 屏幕上实时悬停高亮 DOM 元素。
这一步操作起来很简单，直接点击就能触发，但前提是前三步全部准确完成；若点击后无反应，请立即检查 iOS 是否真的在 Safari 中打开了该网页，而不是从微信、钉钉等第三方 App 内嵌浏览器跳转——那些环境无法被 Safari 开发菜单识别。
