认识

2023年09月07日

柏拉文

越努力，越幸运

一、认识

---

Mark.js 是 JavaScript 的一款关键词高亮库。

二、准备

---

2.1 CDN

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

或者 

<script type="module">
import markJs from 'https://cdn.jsdelivr.net/npm/mark.js@8.11.1/+esm'
</script>

2.2 NPM

npm install mark.js --save-dev

三、语法

---

<style>
    mark{
        color: red;
    }
    mark.mark-class{

    }
</style>

<div class="content"> 这是一个很寂寞的天， 下着有些伤心的雨！</div>

<script>
    const contentDom = document.querySelector('.content');
    const markInstance = new Mark(contentDom);
    markInstance.mark('寂寞',{
        className: 'mark-class'
    });
    markInstance.mark('伤心',{
        className: 'mark-class'
    });
</script>