@ge-ge/highlight
Version:
66 lines (64 loc) • 1.78 kB
HTML
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>i</title>
</head>
<body>
<script src="../dist/index.js"></script>
<div>
<p id="start"><span> </span>fdsa发的是飞洒发1</p>
<p>fdsa发的是飞洒发2"</p>
<p>fdsa发的是飞洒发3</p>
<p id='end'>fdsa发的是飞洒发4</p>
</div>
<div>
<p>fdsa发的是飞洒发1</p>
<p>fdsa发的是飞洒发2</p>
<p>fdsa发的是飞洒发3</p>
<p>fdsa发的是飞洒发4</p>
</div>
<div>
<p>fdsa发的是飞洒发1</p>
<p>fdsa发的是飞洒发2</p>
<p>fdsa发的是飞洒发3</p>
<p>fdsa发的是飞洒发4</p>
</div>
<div>
<p>fdsa发的是飞洒发1</p>
<p>fdsa发的是飞洒发2</p>
<p>fdsa发的是飞洒发3</p>
<p>fdsa发的是飞洒发4</p>
</div>
<div>
<p>fdsa发的是飞洒发1</p>
<p>fdsa发的是飞洒发2</p>
<p>fdsa发的是飞洒发3</p>
<p>fdsa发的是飞洒发4lllllllllllllllllllllllllllllllllllllllllllllll</p>
</div>
<div>
<p>fdsa发的是飞洒发1</p>
<p>fdsa发的是飞洒发2</p>
<p>fdsa发的是飞洒发3</p>
<p>fdsa发的是飞洒发4</p>
</div>
</body>
<script>
console.log(Highlight)
document.oncontextmenu = function () {
let range = window.getSelection().getRangeAt(0)
let highlight = new Highlight({className: 'custom-className', style: {
color: 'red'
}})
// highlight.mark(range)
highlight.markStyle(range)
// highlight.test(range)
// const result = highlight.customMark(range)
// console.log(result.marks)
// for (let i of result.marks) {
// console.log(i.textContent)
// }
}
</script>
</html>