如何用原生js写出最简单的高亮文本(打记笔那样)?

如题,就是选中文本中的一部分,然后给文本添加背景色,像打记笔那样。注意,是给选中的部分添加背景色,不是给整个文本框添加背景色。
然后,打记笔想做几种色,也就是说可以选择。
目前想的思路是先写选中事件,然后再高亮文本。现在选中事件写出来了,高亮文本部分完全不会写。网上看了几个版本,都是超级长的代码,求个最简单版本。

是要手动触发吗,下面是更改鼠标选中文本颜色

img

<!DOCTYPE html>
<html>
  <head>
    <title>Field selection demo</title>
    <style>
      p::selection {
        background: pink;
        color: white;
      }
      ::-moz-selection {
        background: #ccc;
        color: #ff645d;
      }
      ::-webkit-selection {
        background: #ccc;
        color: #ff645d;
      }
    </style>
  </head>
  <body>
    <p>1234567890</p>
  </body>
</html>

可以参考这个 ,你选中的 传入到这个 函数 即可 。