好久没有写点东西了,最近天冷也懒了点.但不能就这么荒废了,安利一下前阵子写的一个chrome小插件

介绍

使用evernote剪藏的时候发现并不是很好用,每次保存都会新建一个文章进行保存,而我的使用场景是,看到一段想保存的文字,选择保存,然后保存到同一个地方.因为剪藏不能满足,所以写了一个小插件.插件可对文本进行高亮,并且高亮的文本会保存到插件的弹出窗口中,使用者可进行编辑.效果可以看我github介绍:点击跳转

实现

实现也相对比较简单.被选择文本内容,通过监听chrome.contextMenus点击,在处理事件的时候可直接获取.需要做的主要就是对选择的文本进行高亮.

文本的高亮通过插入标签,给标签设置颜色实现.所以主要任务变成识别选择的页面内容,然后插入标签,这个可以使用Range对象实现,Range对象可以获取到文本start端和end端的文本节点.基本的思路就是,获取选择文本的Range对象,然后根据对象获取到文本start端的节点,然后给节点添加标签,将节点内容从选择内容剔除,再从新的内容的start端进行同样操作,直到start端节点等于end端节点.当然其中也有一些问题需要处理,不过基本也就是这些了.

2016年展望

健健康康就好了~