10款jQuery文本高亮插件

OneAPM官方技术

于 2016-06-03 13:57:02 发布

阅读量4.6k

点赞数

分类专栏：前端文章标签： jquery 插件

本文链接：https://blog.csdn.net/wangpeng198688/article/details/51578377

版权

本文介绍了10款jQuery文本高亮插件，包括mark.js、highlight、jquery.highlight等，帮助开发者实现在网页中动态高亮搜索关键词，提升用户体验。各插件特点各异，有的注重自定义选项，有的关注性能和兼容性。

摘要由CSDN通过智能技术生成

【编者按】本文作者为 Julian Motz，主要介绍十款 jQuery 文本高亮插件的现状。文章系国内 ITOM 管理平台 OneAPM 编译呈现。

很多应用或网站都为用户提供搜索关键词的方法。为了加快这一过程，提供良好的用户体验，帮助用户准确地查找到他们搜索的内容，你可以在页面中动态高亮这些搜索关键字。

这里有10款jQuery文本高亮插件，可以实现这一功能。

1. mark.js

这是用于搜索术语或自定义正则表达式的关键字高亮插件，使用ES6语言编写，基于几十个跨浏览器的单元测试，以及代码质量监测。它的开发旨在适用于所有用例，包括以下提到的所有文本高亮插件，以及更多插件(比如，diacritics，synonyms和iframes)的用例。

id="cp_embed_RaOzrv" src="//codepen.io/SitePoint/embed/RaOzrv?height=700&theme-id=6441&slug-hash=RaOzrv&default-tab=result&user=SitePoint&embed-version=2" scrolling="no" height="700" allowfullscreen="true" title="CodePen Embed" class="cp_embed_iframe ">

网站
 源码

2. highlight

这是一款非常简单，小型的文本高亮插件，为其他插件奠定了基础。因为它不允许任何自定义，它的优势是文件非常小(1.4 KB)。

id="cp_embed_oxOrxM" src="//codepen.io/SitePoint/embed/oxOrxM?height=500&theme-id=6441&slug-hash=oxOrxM&default-tab=result&user=SitePoint&embed-version=2" scrolling="no" height="500" allowfullscreen="true" title="CodePen Em