在使用米侠浏览器时，你是否想快速更改网页按钮文字、隐藏广告栏、为输入框预设默认值，或临时测试一段交互逻辑？这些操作都无需修改源码，只需在控制台执行一行JavaScript代码即可实现。下面逐步拆解，从元素定位到批量修改，手把手教你掌握页面实时编辑技巧。
首先打开控制台，定位你想要修改的目标元素。点击地址栏右侧的“菜单”按钮（三个竖点图标），选择“检查元素”——若该选项未出现，请前往【设置】→【高级设置】中开启“开发者选项”。Elements面板展开后，鼠标悬停或点击页面任意区域，对应的HTML节点便会高亮显示；你也可以直接在Elements树中手动展开查找。例如要修改页脚，就找到标签。
找到目标元素后，右键点击它，选择“Copy” → “Copy selector”，即可获取其CSS选择器（例如#main-content .title），后续在JavaScript代码中直接粘贴使用。
先打开控制台并定位目标元素
（上一步已详细说明，这里直接衔接。）切换到Console面板，在光标处粘贴以下任一代码并按下回车键：
方法一：修改文本内容
直接替换元素文字：document.querySelector("#main-content .title").textContent = "新标题已上线";
方法二：修改HTML结构 已屏蔽广告
插入带标签的内容：document.querySelector(".ad-banner").innerHTML = "
方法三：修改样式属性
动态调整外观：document.querySelector("button#submit").style.backgroundColor = "#4CAF50";
注意：若目标元素为异步加载（例如滚动后才出现的卡片），querySelector可能返回null。此时需先确认元素已存在，或改用document.querySelectorAll()[0]配合条件判断。
用JavaScript修改元素内容与样式
（上述方法已涵盖。接下来进入创建新元素环节。）有时候仅修改现有元素还不够，你可能需要向页面“插入”一个新元素，比如添加一个调试提示框。具体步骤如下：
第一步：新建一个div元素const newBox = document.createElement("div");
第二步：设置ID和内容newBox.id = "debug-overlay"; newBox.textContent = "调试模式已激活";
第三步：添加内联样式使其可见newBox.style.cssText = "position:fixed;top:10px;right:10px;background:#000;color:#fff;padding:8px 12px;z-index:9999;border-radius:4px;";
第四步：将新元素添加到页面body末尾document.body.appendChild(newBox);
执行后，页面右上角会立即出现一个黑色小提示框。后续若想删除它，只需执行document.getElementById("debug-overlay").remove();即可。
创建新元素并插入到页面中
（以上展示了创建新元素的步骤。批量操作则更加高效。）如果你需要批量处理多个同类元素，例如给页面中所有链接都加上“[外链]”标识，仅需一行：
document.querySelectorAll("a[href]").forEach(link => { link.textContent += " [外链]"; });
又比如隐藏全部class为“sidebar-ad”的区块：
document.querySelectorAll(".sidebar-ad").forEach(el => el.style.display = "none");
这种写法比逐个指定ID高效得多，特别适合处理列表、导航栏、评论区等重复结构。掌握这些技巧，你便能在米侠浏览器中随心所欲地调整页面内容。
