必须开启开发者选项并重启浏览器才能使用米侠浏览器的开发者工具,否则快捷键和右键检查均无效;开启后可通过快捷键、右键或菜单调出工具,用于实时调试DOM、CSS、网络请求及本地存储。

你想在米侠浏览器里实时查看网页结构、修改样式、拦截请求、检查存储数据,而不是靠猜或反复刷新——这些操作必须通过开发者工具完成,且每一步都依赖前序配置是否到位。
开启开发者工具并验证可用性
点击浏览器右下角三条横线图标 → 进入【设置】→ 向下滚动找到【高级设置】→ 打开【开发者选项】开关。这一步是全部后续操作的前提,【若跳过此步,按 Ctrl+Shift+I、F12、右键“检查元素”全部无效】。开启后系统弹出提示“需重启浏览器以生效”,请立即完全退出米侠浏览器(包括后台进程),再重新启动。
重启后打开任意网页(如 https://example.com),执行以下任一操作:
方法一:按 Ctrl + Shift + I(Windows/Linux)或 Cmd + Option + I(macOS),开发者工具应直接弹出且默认定位在 Elements 面板。
方法二:在网页空白处右键 → 若出现“检查元素”选项,点击即可高亮鼠标悬停位置对应的 DOM 节点。
方法三:点击地址栏最右侧三点竖排图标 → 在展开菜单中查找“检查元素”,点击调出工具。
成功标志:按 Ctrl + Shift + C 后鼠标变为带方框的箭头,单击页面任意元素,Elements 面板自动跳转并高亮其 HTML 标签,且双击文本可即时编辑并实时更新页面。
定位并调试目标元素的CSS样式
当按钮颜色不对、文字间距异常或布局错位时,先用源码快速锚定结构:右键网页任意空白处 → 点击【查看网页源代码】→ 新标签页显示原始HTML。注意:此操作只显示服务器返回的初始HTML,不包含JavaScript动态插入的内容。
使用 Ctrl+F(Windows)或 Cmd+F(Mac)搜索目标 class 名(如 header-btn)或 id(如 main-nav),找到包裹该元素的 HTML 标签。若搜不到,说明该元素由 JS 动态生成,此时需切换回原页面 → 按 F12 打开开发者工具 → 在 Elements 面板中手动展开 DOM 树查找。
复制查到的 class 属性值(例如 class="btn primary large" 中的 primary)→ 回到原页面按 F12 → 切换到 Elements 面板 → 点击对应元素 → 右侧 Styles 面板自动列出所有匹配的 CSS 规则 → 逐条检查每条规则的来源文件和行号。
在 Styles 面板中,点击带删除线的属性名(如 color)→ 查看被覆盖的原因:可能是更具体的选择器、!important 声明、或后加载的样式表。这一步能直接暴露优先级冲突根源,避免盲目改写。
捕获并分析网页真实请求头
打开目标网页后,直接按 F12 键 → 点击顶部标签栏中的「网络(Network)」选项卡。这一步不能跳过——如果没点进 Network 面板就刷新页面,请求记录不会被保存,Header 就彻底丢失了。
按下 Ctrl + R(Windows/Linux)或 Cmd + R(macOS)重新加载整个页面。注意:必须是完整刷新,不是点击地址栏回车,否则可能只触发部分资源请求,首屏 HTML 的主请求可能被漏掉。
刷新后,Network 面板左侧会立即出现一长串条目,第一个通常是当前网页的 HTML 文档请求,域名结尾带 .html、.php 或无后缀但状态码为 200。点击该行 → 右侧自动切换至详情视图 → 点击顶部「Headers」标签 → 向下滚动至「Request Headers」区域。
【关键提示】米侠浏览器默认不显示「发起者(Initiator)」列,因此务必通过 URL 匹配确认,避免误点 CSS/JS/AJAX 等子资源请求。 此时你将看到完整的 HTTP 请求头,包括 User-Agent、Cookie、Accept、Referer、Authorization 等字段,每一行都是真实发出的原始 Header 行。
查看与修改网页本地存储数据
在目标网页标签页中按 F12 打开开发者工具 → 点击顶部导航栏的 Application 标签 → 左侧边栏展开 Storage 分类 → 点击 localStorage。此时右侧会列出当前域名下所有已存储的键值对。
【必须先加载过目标网页,且该页面脚本已执行过 localStorage 操作,否则列表为空】。如果页面刚打开还没触发存储逻辑,可先手动刷新一次。
在右侧键值列表中,点击任意一行的 key 或 value 区域即可直接编辑。编辑 value 时支持 JSON 字符串、纯文本、数字等多种格式;修改后按回车确认,新值立即生效并同步到页面运行时环境。例如把 "isLogin": "false" 改成 "isLogin": "true",刷新页面后可能直接跳过登录页。
右键目标 key → 选择 Delete,可删除单个键;右键左侧 localStorage 节点 → 选择 Clear storage → 在弹出框中勾选“Local storage” → 点击 Clear,可清空当前域名全部 localStorage 数据。
切换到 Console 标签页 → 输入 localStorage.clear() 并回车。这行代码会立刻清空当前页面域名下的所有 localStorage 数据,无二次确认。
通过控制台实时修改DOM元素
点击地址栏右侧的“菜单”按钮(三点竖排图标)→ 选择“检查元素”。Elements 面板展开后,用鼠标悬停或点击页面上的任意区域,对应 HTML 节点会高亮;也可以在 Elements 树中手动展开查找,比如要改页脚,就找 <footer> 标签。
找到目标元素后,右键它 → 选择“Copy” → “Copy selector”,这样就拿到了它的 CSS 选择器,比如 #main-content .title,后面执行 JS 时会用到。
切换到 Console 面板,在光标处粘贴以下任一代码并按回车:
方法一:改文本内容
document.querySelector("#main-content .title").textContent = "新标题已上线";
方法二:改 HTML 结构
document.querySelector(".ad-banner").innerHTML = "<div style='color:red;font-weight:bold'>已屏蔽广告</div>";
方法三:改样式属性
document.querySelector("button#submit").style.backgroundColor = "#4CAF50";
【注意:如果元素是异步加载的(如滚动后出现的卡片),querySelector 可能返回 null。此时需先确认元素已存在,或改用 document.querySelectorAll()[0] 配合判断】


















