mark.js
用 JavaScript 写的文本高亮库,按关键词、正则或字符区间把匹配文字包进 mark 元素,支持变音符号匹配、整词精度和 iframe 内容,适合前端开发者给站内搜索和表格筛选加上高亮。

mark.js 是一个用 JavaScript 写的文本高亮库。它做的事很具体:给定一段关键词或一条正则表达式,在页面指定区域里找出匹配的文字,把它们包进 元素,浏览器默认就会显示成高亮。站内搜索、表格筛选、列表过滤这类需要「把用户搜到的词标出来」的场景,可以直接拿它当底层。
主要功能
核心是三个方法:mark() 处理普通关键词,markRegExp() 处理正则,markRanges() 按字符区间标记,另有 unmark() 撤销。选项里比较实用的有 separateWordSearch(按空格拆词分别搜)、accuracy(partially / complementary / exactly 三档,决定「lor」要不要匹配到「lorem」里)、diacritics(带变音符号的字符也能对上),以及 exclude 排除某些元素、自定义包裹元素和类名。它还能处理 iframe 里的内容。
怎么用
可以用 npm 或 Bower 安装,也可以从 cdnjs、jsdelivr 加载,或者直接下载文件引入。包里有纯 JavaScript 和 jQuery 插件两套文件,各分 ES5 与 ES6 版本,压缩版是推荐用法。初始化时传入一个元素、元素数组、NodeList 或选择器字符串作为搜索范围,之后在实例上调用方法;jQuery 下则直接挂在选中的元素上。官方还提供了 DataTables 和 tablesorter 的集成插件。
适合谁
适合要自己实现搜索高亮的前端开发者,尤其是项目里已经在用 jQuery、或者需要处理多语言变音字符的。它只负责标记,样式要自己写 CSS;mark() 是异步的,官方建议用 done 回调而不是靠链式调用。文档全英文,API 和教程都在同一页。