是一个流行的 JavaScript 库，用于在网页中高亮显示指定的文本内容（如搜索关键词）。以下是它的基本使用方法：

<script src="https://cdn.jsdelivr.net/npm/mark.js/dist/mark.min.js"></script>

<div id="content">
  <p>这是一段示例文本，用于演示 mark.js 的高亮功能。</p>
</div>
<button onclick="highlightText()">高亮关键词</button>

// 初始化 Mark 实例
const instance = new Mark(document.querySelector("#content"));

function highlightText() {
  // 高亮关键词（支持数组）
  instance.unmark().mark(["示例", "mark.js"]);
}

instance.mark("关键词", {
  element: "span", // 自定义标签，默认是 <mark>
  className: "custom-highlight", // 自定义 CSS 类
  exclude: ["script", "style"], // 排除的标签
  caseSensitive: false, // 是否区分大小写
  ignoreJoiners: true, // 忽略分隔符（如空格、标点）
 acrossElements: true, // 跨元素匹配
});

在 CSS 中为高亮元素添加样式：

.custom-highlight {
  background-color: yellow;
  color: red;
}

如果页面内容是通过 AJAX 动态加载的，需要在内容更新后重新调用 

通过以上步骤，你可以快速实现文本高亮功能。更多高级用法可参考

mark.js的使用方法

前端开发工程

前端

mark.js是一款实用的JavaScript文本高亮库，支持关键词搜索高亮、自定义样式和动态内容处理。通过CDN或npm安装后，可轻松实现多关键词高亮、正则匹配等功能，并支持自定义标签和CSS样式，适合网页搜索关键词突出显示需求。

CDN 境内流量包 1元起 ，更有新老同享套餐包0.09元/GB起，立即选购


文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

mark.js的使用方法

mark.js的使用方法

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐