首页 > 如何用javascript实现高亮选中的文本

如何用javascript实现高亮选中的文本

如何用javascript实现高亮选中的文本

我的提问似乎不太清晰。。就像“https://dev.vijos.org/problems/P1006”,选中描述部分的文本,会出现一个浮动的小框,可以选择颜色使得选中的文本高亮


<span onmouseover="this.style.background='red'">哈哈哈</span>
<span onmouseover="this.style.background='yellow'">嘎嘎嘎</span>
<span onmouseover="this.style.background='green'">哇哇哇</span>

你早说啊!

首先你要全局监听ONMOUSEUP事件,好弹出那个小泡泡,对吧,这个很简单就不说了,
剩下的就是获得选中的部分,
例如这句话“南方周末”,你选中了“方周”
浏览器里面有个方法
var a = window.getSelection();
这个方法你可以获得一个对象,你面包含了你当前所选中的对象的一些信息。
然后 a.getRangeAt(); 之后你会获得选中的信息,
var b = a.getRangeAt();
其中有两个字段,即
b.endOffset(此时等于3)
b.startOffset(此时等于1)
这两个值代表着“方周”在“南方周末”的起始和结束位置,剩下就简单了。

【热门文章】
【热门文章】