夜雨聆风在国际化（i18n）项目或多语言适配场景中，我们经常需要快速找出页面中遗留的中文文本。本文整理了几个实用的 JavaScript 小脚本，覆盖控制台运行、书签运行、浏览器插件三种使用方式，按需取用即可。
背景
在做多语言适配、汉化检查或国际化工单排查时，手动翻页面找中文既费时又容易遗漏。借助一段递归遍历 DOM 的脚本，可以一键定位页面中所有包含中文字符的文本节点，并高亮/汇总输出。
下面按"由轻到重"的顺序，依次给出三种实现方案。
版本 1：控制台运行
最轻量的方案，无需安装、无需配置，复制粘贴即可使用。
脚本源码
function bfs(root) {if (root == null) return 0;var result = 0;var q = [];q.push(root);while (q.length > 0) {let node = q.shift();for (let i = 0; i < node.childElementCount; i++) {child = node.children[i];if (child.childElementCount == 0) {var txt = child.innerText;if (/.*[一-龥]+.*$/.test(txt)) {result += 1;console.log(txt);console.log(child);}} else {q.push(child);}}}return result;}var cnt = bfs(document.body);console.log("存在中文 " + cnt + " 条");
使用方法
在目标页面按 F12打开开发者工具切换到 Console 面板 粘贴上面的代码并回车
运行效果
控制台输出命中元素的文本内容及对应 DOM 节点，并在最后打印命中总数。
版本 2：书签运行（Bookmarklet）
将脚本保存为浏览器书签，在任意页面点击即可运行，比控制台粘贴更便捷。下面给出三个递进版本，可按需求选择。
版本 2.1：基础版 —— 弹窗 + 控制台
只输出结果，不做页面标记。
javascript:(function () {var c = 0, q = [document.body], r = /[一-龥]/;while (q.length) {var n = q.shift();for (var i = 0; i < n.childNodes.length; i++) {var ch = n.childNodes[i];if (ch.nodeType === 3) {var t = ch.textContent.trim();if (r.test(t)) {c++;console.log(ch);}} else if (ch.nodeType === 1) {q.push(ch);}}}console.log('🎯 检查完毕，共发现 ' + c + ' 处中文');alert('检查完毕，共发现 ' + c + ' 处中文');})();
使用方法：浏览器新建书签，将上述代码粘贴到"网址"一栏，在需要检查的页面点击该书签即可。
运行效果：弹窗提示命中总数，控制台同步输出命中的文本节点。
版本 2.2：高亮版 —— 红框标记
在 2.1 的基础上，给命中元素的父节点加上红色外框和浅红背景，页面上一眼可见。
javascript:(function () {var c = 0, q = [document.body], r = /[一-龥]/;while (q.length) {var n = q.shift();for (var i = 0; i < n.childNodes.length; i++) {var ch = n.childNodes[i];if (ch.nodeType === 3) {var t = ch.textContent.trim();if (r.test(t)) {c++;var p = ch.parentElement;if (p && !p.style.outline) {p.style.outline = '2px solid red';p.style.backgroundColor = 'rgba(255,0,0,0.05)';}}} else if (ch.nodeType === 1) {q.push(ch);}}}console.log('🎯 检查完毕，共发现 ' + c + ' 处中文');alert('检查完毕，共发现 ' + c + ' 处中文');})();
运行效果：弹窗提示命中总数，命中元素以红框高亮显示。
版本 2.3：表格版 —— console.table 输出
将命中信息以表格形式打印，结构化更清晰，便于复制和分析。
javascript:(function () {var hits = [],q = [document.body],r = /[一-龥]/;while (q.length) {var n = q.shift();for (var i = 0; i < n.childNodes.length; i++) {var ch = n.childNodes[i];if (ch.nodeType === 3) {var t = ch.textContent.trim();if (r.test(t)) {var p = ch.parentElement;if (p && !p.style.outline) {p.style.outline = '2px solid red';p.style.backgroundColor = 'rgba(255,0,0,0.05)';hits.push({tag: p.tagName.toLowerCase(),text: t.slice(0, 50) + (t.length > 50 ? '...' : ''),xpath: (function (e) {var s = [];while (e && e.nodeType === 1) {s.unshift(e.tagName.toLowerCase());e = e.parentNode;}return '/' + s.join('/');})(p)});}}} else if (ch.nodeType === 1) {q.push(ch);}}}console.table(hits);console.log('🎯 共 ' + hits.length + ' 处中文');alert('共发现 ' + hits.length + ' 处中文，详见控制台');})();
运行效果：弹窗提示命中总数，命中元素红框高亮，控制台以表格输出标签、文本摘要、XPath 等信息。
版本 3：浏览器插件
如果需要更完整的功能（一键复制、导出 JSON、批量管理），可以直接使用打包好的 Chrome 插件。
- 1. 关注公众号：【Code自习室】2. 后台回复关键词：【中文检测】
使用方法
下载源码到本地 在 Chrome 中打开 chrome://extensions/启用"开发者模式"，选择"加载已解压的扩展程序"，选中插件目录 在需要检查的页面点击插件图标即可运行
运行效果
输出命中元素总数 列出每个命中元素的详细信息 支持一键复制命中信息或导出为 JSON 命中数据在页面上以红色高亮标记
实现思路简析
三种方案的核心逻辑一致：
- 广度优先遍历 DOM
：以 document.body为根，使用队列q逐层遍历所有子节点。 - 判定中文
：用正则 /[一-龥]/（等价于/[一-龥]/）匹配 CJK 统一汉字范围。 - 节点类型区分
： nodeType === 3→ 文本节点，检查内容 nodeType === 1→ 元素节点，继续入队遍历 - 去重与高亮
：通过 p.style.outline是否已设置来判断该父元素是否已被标记，避免重复高亮和重复统计。
版本 1 的差异在于它遍历的是
children（元素节点）而非childNodes（含文本节点），且通过childElementCount == 0判断叶子元素再取innerText，逻辑上更粗略，但已能满足快速排查需求。版本 2/3 改用childNodes+nodeType判断，更贴近 DOM 实际结构，精度更高。
方案对比
总结
- 偶尔用一下
：直接复制版本 1 到控制台 - 要反复检查
：把版本 2.3 存成书签 - 要持久化、可复用、可导出
：装版本 3 的浏览器插件
按场景选择合适的工具，才能让脚本真正发挥作用。希望这篇指南对正在做多语言适配的同学有所帮助。
