仿M浏览器元素审查

Aloazny

•

Created 9 months ago

•

Updated 15 days ago

利用AI模仿并生成M浏览器的元素审查（感谢M浏览器原生交互灵感），在脚本菜单开启元素审查，专注精准AD规则生成与编辑，支持DOM树浏览、实时编辑（文字/代码/删除/换图/撤销）、存储管理、JS终端等功能。

#调试工具

#DOM编辑

#Adblock规则生成

#存储管理

仿M浏览器元素审查

简介

模拟移动端原生元素审查交互，参考M浏览器代码，提供接近原生的 DOM 调试体验。
支持原生浏览器环境 and GM 脚本环境（Tampermonkey / Violentmonkey 等）。
内置智能 Adblock 规则生成，根据元素特征自动生成多种高精度拦截建议。
集成存储管理工具，可实时查看、修改、删除当前域名的 Cookie、SessionStorage 和 LocalStorage。
提供简易 JS 执行终端，支持在移动端直接运行代码并查看实时控制台输出。
支持悬浮图标自定义，可调整大小、位置、SVG 样式，也可通过脚本菜单完全隐藏图标。
新增 DOM 树可视化浏览与直接编辑功能，支持文字编辑、HTML 源码编辑、元素删除、图片替换、操作撤销等。
新增网络请求拦截面板，实时捕获 XHR / Fetch 请求，查看请求头、响应头、响应体，并支持一键生成 Adblock 规则。
新增资源加载监控，支持 Script / Stylesheet / IMG / 字体等静态资源查看与预览，内置广告资源智能过滤。
新增链接提取功能，可一键扫描选中元素内所有有效链接、图片、音视频、文档地址，支持分类标签与快捷打开。
新增元素搜索功能，支持关键词、CSS 选择器、Adblock 规则（含 :has-text / :-abp-has / :-abp-properties 等扩展语法）三种检索方式。
新增"自由浏览模式"，面板收起后仍可正常滚动、点击、选取元素，长按屏幕或点击悬浮图标即可返回审查面板。
新增智能抬升机制，自动识别页面滚动容器并注入 spacer / 位移 fixed 元素，避免面板被网页底部悬浮条遮挡。

使用说明

开启审查面板 通过脚本菜单"开启/关闭审查面板"或点击右下角悬浮图标（默认显示，可在菜单中隐藏）进入调试模式。进入后页面自动切换到拾取状态。
元素拾取与高亮 点击页面任意元素即可选中，高亮显示并自动展开 DOM 树视图。同时底部会出现操作栏。
DOM 编辑与提取功能
- 文字模式：直接在页面上编辑元素文本内容（类似 contenteditable）。
- 代码模式：在面板中编辑元素的完整 innerHTML，确认后同步到页面。
- 删除元素：直接移除选中节点。
- 替换图片：针对 img 标签或有背景图的元素，可上传本地图片替换。
- 撤销操作：支持多次回退最近的修改（删除、替换、编辑等）。
- 复制提取：支持一键提取并复制选中元素的 XPath、完整 HTML 代码 以及 纯文本内容。
- 隐藏选取：清除当前选中状态，方便重新拾取。
Adblock 规则生成 选中元素后切换到"AD规则"标签页，自动生成多条候选规则（域名 + ID / 类名 / 属性 / 层级 / :has() / :not() 等组合）。
支持：
- 实时预览（隐藏元素效果）
- 手动编辑规则
- 一键复制，或直接添加到 B仔 / Via / X浏览器（若环境支持）
存储数据管理 切换到"数据"标签页，可视化查看和管理当前域名的：
- Cookie（含多路径 / 多域名的兼容性删除）
- SessionStorage
- LocalStorage
  支持单条复制、修改、删除，以及一键清空全部。
JS 执行终端 切换到"JS代码"标签页，可输入任意 JavaScript 代码并立即执行。
支持查看实时日志（包括 console.log / error / warn / table 等），也可开启网页原生日志监听。
网络请求监控（新）切换到"网络"标签页，可查看：
- Network：拦截 XHR / Fetch 请求，含 URL、Method、Status、耗时、请求头、响应头、响应体（自动语法高亮）。
- Resource：读取 performance.getEntriesByType('resource')，展示页面所有静态资源。
- 内置 ADS 智能过滤，可一键筛出疑似广告请求。
- 每条请求支持 一键生成 Adblock 规则（基础域名 / 智能路径 / 目录规则 / 完整路径）。
- 资源预览：图片直显、字体渲染预览、JS / CSS / HTML 自动格式化。
链接提取（新）选中元素后点击操作栏"🔗 提取链接"，自动扫描元素内所有 href / src / data-* 等有效链接：
- 按类型打标签（link / img / mp4 / m3u8 / mp3 / pdf / 自定义协议等）。
- 支持一键复制、直接打开，或触发自定义协议（如 coolapkmarket:// / magnet: / weixin://）。
元素搜索（新）点击操作栏"🔍 搜索元素"，支持三种检索方式：
- 关键词：匹配标签名、文本内容、属性名/属性值。
- CSS 选择器：如 .class / #id / div[data-x]。
- Adblock 规则：支持 ##.class、:has-text()、:contains()、:-abp-has()、:-abp-properties() 等扩展语法。
  搜索结果支持上一项 / 下一项循环跳转，并同步高亮与滚动定位。
自由浏览模式（新）点击面板顶部"▼ 收起"按钮进入自由浏览模式：
- 面板完全隐藏，页面恢复原生滚动、点击、文本选择等交互。
- 单击页面元素仍会拾取并高亮，但不会弹出面板。
- 长按屏幕约 0.3 秒 或 点击悬浮图标，即可返回审查面板并展示刚刚选中的元素。
- 面板智能识别页面滚动容器与底部悬浮元素，自动撑高 / 位移以避免遮挡。
图标与入口自定义 在"图标"标签页可调整：
- 图标大小、底部 / 右侧距离
- 自定义 SVG 代码
- 临时隐藏或通过菜单永久隐藏悬浮图标

小提示

大部分操作支持撤销（历史栈），误操作后可通过"撤销"按钮恢复。
规则预览和元素编辑均为临时效果，刷新页面会还原。
若当前页面有动态加载内容，建议重新拾取以获取最新 DOM 结构。
网络面板中的请求记录最多保留 300 条，超出后自动丢弃最早的记录。
资源预览功能受跨域限制影响，部分资源可能显示 "CORS Blocked"，但可直接下载查看。
自由浏览模式下的长按判定约 0.3 秒，位移超过 10px 视为滚动，不会触发返回面板。

Loading…