标注浏览器文本内容的方法、装置及电子设备制造方法及图纸

本发明专利技术公开了一种标注浏览器文本内容的方法，包括：获得用户选择的文本选区信息；对文本选区信息进行分隔元素，获取所述文本选区信息中的node节点；在所述node节点中找到首节点和尾节点，遍历DOM树，找到所述首节点和尾节点之间的所有中间文本节点；对找到的所有node节点添加预设显示效果，并替换原文本选区信息；存储添加预设显示效果后的文本选区信息。本发明专利技术还公开了标注浏览器文本内容的装置和电子设备。与现有技术相比，本发明专利技术使得用户在浏览器上浏览文本内容时，可选择多段文字，且在刷新滑动后依然保持预设效果。新滑动后依然保持预设效果。新滑动后依然保持预设效果。

Method, device and electronic device for marking browser text content

【技术实现步骤摘要】
标注浏览器文本内容的方法、装置及电子设备


[0001]本专利技术涉及一种浏览器页面显示浏览方法，尤其涉及一种标注浏览器文本内容的方法。

技术介绍

[0002]随着技术的发展，当前web浏览器的功能越来越丰富，已经不仅仅是简单的访问网页。很多人在浏览器上查找资料，阅读文档。我们很多时候滑动鼠标选择文本复制出来，但同时只能选择某一段文本，再次滑动之前被选中的文本就会丢失。故，现有的浏览器文本标注具有以下问题：不能多选不同的文本内容，没有类似笔记中多处文本持续高亮的功能，页面刷新或者滑动后被选中的文本会丢失。
[0003]故，急需一种可解决上述问题的标注浏览器文本内容的方法、装置。

技术实现思路

[0004]本专利技术的目的是提供一种标注浏览器文本内容的方法、装置和电子设备，可选择多段文字，且在刷新滑动后依然保持预设效果。
[0005]为了实现上述目的，本专利技术公开了一种标注浏览器文本内容的方法，包括：获得用户选择的文本选区信息；对文本选区信息进行分隔元素，获取所述文本选区信息中的node节点；在所述node节点中找到首节点和尾节点，遍历DOM树，找到所述首节点和尾节点之间的所有中间文本节点；对找到的所有node节点添加预设显示效果，并替换原文本选区信息；存储添加预设显示效果后的文本选区信息。
[0006]较佳地，“存储添加预设显示效果后的文本选区信息”具体为离线存储添加预设显示效果后的文本选区信息。
[0007]具体地，通过localStorage离线存储添加预设显示效果后的文本选区信息。
[0008]较佳地，使用Selection API获得用户选择的文本选区信息；通过splitText对文本选区信息进行分隔元素；对找到的所有node节点套用一Dom标签以添加预设显示效果；使用replaceChild替换原文本选区信息。
[0009]较佳地，所述预设显示效果为高亮显示。
[0010]本专利技术还公开了一种标注浏览器文本内容的装置，包括选区获取单元、节点获取单元、节点搜寻单元、渲染显示单元和选区存储单元，选区获取单元，获得用户选择的文本选区信息；节点获取单元，对文本选区信息进行分隔元素，获取所述文本选区信息中的node节点；节点搜寻单元，在所述node节点中找到首节点和尾节点，遍历DOM树，找到所述首节点和尾节点之间的所有中间文本节点；渲染显示单元，对找到的所有node节点添加预设显示效果，并替换原文本选区信息；选区存储单元，存储添加预设显示效果后的文本选区信息。
[0011]较佳地，所述选区存储单元离线存储添加预设显示效果后的文本选区信息。
[0012]具体地，所述选区存储单元通过localStorage离线存储添加预设显示效果后的文本选区信息。
[0013]较佳地，所述选区获取单元使用Selection API获得用户选择的文本选区信息；所述节点获取单元通过splitText对文本选区信息进行分隔元素；所述渲染显示单元对找到的所有node节点套用一Dom标签以添加预设显示效果，使用replaceChild替换原文本选区信息。本专利技术采用浏览器插件和文本的API来实现对浏览器网络页面多段内容的预设效果显示，可精细获取用户选择的每一个文字。当然，也可以采用监听dom的方式获取dom下的文本选区信息。
[0014]较佳地，所述预设显示效果为高亮显示。
[0015]本专利技术还公开了一种电子设备，包括：一个或多个处理器；存储器；以及一个或多个程序，其中所述一个或多个程序被存储在所述存储器中，并且被配置成由一个或多个处理器执行，所述程序包括用于执行如上所述的标注浏览器文本内容的方法的指令。
[0016]本专利技术还公开了一种计算机可读存储介质，包括与具有存储器的电子设备结合使用的计算机程序，所述计算机程序可被处理器执行以如上所述的标注浏览器文本内容的方法。
[0017]与现有技术相比，本专利技术使得用户浏览浏览器页面时，选择页面上若干文本段落或语句后，可使用特殊效果(预设显示效果，例如高亮)标记用户选择的文本信息，使得用户可以在浏览器上进行笔迹标记，便于用户通过浏览器查看文章页面、小说页面等。具体地，先获得出用户选择的文本选区所有node节点(字节或要素)，然后遍历DOM对所有node节点进行预设效果渲染，使得本专利技术文本选区和渲染具有普适性，可兼顾多种型号的浏览器，兼容性好。另一方面，本专利技术在文本选区渲染显示后，还存储渲染后的文本信息，不但使得网页刷新滑动后，选中的文本选区依然保持预设的显示效果，还可以持续选择多个文本选区，使得多个文本选区均保持预设的显示效果，使得用户在浏览器网络页面浏览文本时，可以进行持久化存储标注。
[0018]再者，本专利技术还通过使用JS代码，结合浏览器插件和文本的API(应用程序接口，Application Programming Interface)，来实现对浏览器网络页面多段内容的预设效果显示，进一步增加本专利技术的普适性和浏览器兼容性。
附图说明
[0019]图1是本专利技术标注浏览器文本内容的方法的流程图。
[0020]图2是本专利技术一优选实施例中标注浏览器文本内容的方法的流程图。
[0021]图3是本专利技术标注浏览器文本内容的装置的结构框图。
[0022]图4是本专利技术一电子设备的结构框图。
具体实施方式
[0023]为详细说明本专利技术的
技术实现思路
、构造特征、所实现目的及效果，以下结合实施方式并配合附图详予说明。
[0024]参考图1，本专利技术公开了一种标注浏览器文本内容的方法100，包括步骤：S11获得用户选择的文本选区信息；S12对文本选区信息进行分隔元素，获取所述文本选区信息中的node节点；S13在所述node节点中找到首节点和尾节点，遍历DOM树，找到所述首节点和尾节点之间的所有中间文本节点；S14对找到的所有node节点添加预设显示效果，并替换原文本
选区信息；S15存储添加预设显示效果后的文本选区信息。
[0025]较佳者，步骤S15具体为：“存储添加预设显示效果后的文本选区信息”具体为离线存储添加预设显示效果后的文本选区信息。
[0026]参考图2，步骤S11中，使用Selection API获得用户选择的文本选区信息。
[0027]参考图2，步骤S12中，通过splitText对文本选区信息进行分隔元素。
[0028]参考图2，步骤S14中，对找到的所有node节点套用一Dom标签以添加预设显示效果，使用replaceChild替换原文本选区信息。
[0029]参考图2，步骤S15中，通过localStorage离线存储添加预设显示效果后的文本选区信息。
[0030]本实施例中，所述预设显示效果为高亮显示。即，步骤S14中对找到的所有node节点套用高亮显示的Dom标签。当然，该预设显示效果也可以为其他显示效果，例如闪烁、字体倾斜、加黑等等标识效果。
[0031]参考图3，本专利技术还公开了一种标注本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种标注浏览器文本内容的方法，其特征在于：包括：获得用户选择的文本选区信息；对文本选区信息进行分隔元素，获取所述文本选区信息中的node节点；在所述node节点中找到首节点和尾节点，遍历DOM树，找到所述首节点和尾节点之间的所有中间文本节点；对找到的所有node节点添加预设显示效果，并替换原文本选区信息；存储添加预设显示效果后的文本选区信息。2.如权利要求1所述的标注浏览器文本内容的方法，其特征在于：“存储添加预设显示效果后的文本选区信息”具体为：离线存储添加预设显示效果后的文本选区信息。3.如权利要求2所述的标注浏览器文本内容的方法，其特征在于：通过localStorage离线存储添加预设显示效果后的文本选区信息。4.如权利要求1所述的标注浏览器文本内容的方法，其特征在于：使用Selection API获得用户选择的文本选区信息；通过splitText对文本选区信息进行分隔元素；对找到的所有node节点套用一Dom标签以添加预设显示效果；使用replaceChild替换原文本选区信息。5.如权利要求1所述的标注浏览器文本内容的方法，其特征在于：所述预设显示效果为高亮显示。6.一种标注浏览器文本内容的装置，其特征在于:包括：选区获取单元，获得用户选择的文本选区信息；节点获取单元，对文本选区信息进行分隔元素，获取所述文本选区信息中的node节点；节点搜寻单元，在所述node节点中找到首节点和尾节点，遍历DOM树，找到所述首节点和尾节点之间的所有中间文本节点；渲染显示单元，对...

【专利技术属性】
技术研发人员：吴迪，万振华，王颉，李华，董燕，
申请(专利权)人：深圳开源互联网安全技术有限公司，
类型：发明
国别省市：