用于对网页中关键字进行展示的方法及其相关产品技术

本发明专利技术的实施方式提供了一种用于对网页中关键字进行展示的方法及相关产品。该方法包括：响应于对所述网页中关键字的展示需求，获取关于所述关键字的搜索结果；以及根据所述搜索结果在所述网页中绘制关于所述关键字的高亮层，以完成对一个或多个所述关键字的展示。通过本发明专利技术的方案，可以在不改变搜索区域DOM结构的前提下实现对一个或多个关键字的展示。结构的前提下实现对一个或多个关键字的展示。结构的前提下实现对一个或多个关键字的展示。

【技术实现步骤摘要】
用于对网页中关键字进行展示的方法及其相关产品


[0001]本专利技术的实施方式涉及互联网
，更具体地，本专利技术的实施方式涉及用于对网页中关键字进行展示的方法、用于执行前述方法的设备和计算机可读存储介质。

技术介绍

[0002]本部分旨在为权利要求书中陈述的本专利技术的实施方式提供背景或上下文。此处的描述可包括可以探究的概念，但不一定是之前已经想到或者已经探究的概念。因此，除非在此指出，否则在本部分中描述的内容对于本申请的说明书和权利要求书而言不是现有技术，并且并不因为包括在本部分中就承认是现有技术。
[0003]为了快速帮助用户找到Web网页上的内容，网站一般会提供搜索功能，并以高亮的方式展示搜索关键字。通常，对关键字的高亮处理会涉及到对搜索区域的网页进行修改，并进而导致搜索区域的DOM结构发生变化。在有些场景下，修改搜索区域而导致DOM结构变化会产生一些副作用。例如，网页的搜索区域内有部分标签可能会绑定一些动作(例如“点击”)，DOM结构发生改变可能会引起绑定动作的丢失，后续不得不重新绑定这些动作，从而导致整个关键字展示的实现过程非常繁琐。

技术实现思路

[0004]已知的对网页中关键字的展示过程繁琐且展示效果不理想，这是非常令人烦恼的过程。
[0005]为此，非常需要一种改进的用于对网页中关键字进行展示的方法及其相关产品，无需修改搜索区域的DOM结构，可根据关键字的搜索结果所绘制的高亮层来实现对关键字的展示。
[0006]在本上下文中，本专利技术的实施方式期望提供一种用于对网页中关键字进行展示的方法及其相关产品。
[0007]在本专利技术实施方式的第一方面中，提供了一种用于对网页中关键字进行展示的方法，包括：响应于对所述网页中关键字的展示需求，获取关于所述关键字的搜索结果；以及根据所述搜索结果在所述网页中绘制关于所述关键字的高亮层，以完成对一个或多个所述关键字的展示。
[0008]在本专利技术的一个实施例中，其中所述搜索结果包括以搜索单元为单位获得的对关键字的搜索结果，每个所述搜索单元的搜索结果包括关键字和关键字在所述网页的HTML文档的文档对象模型树中的位置信息。
[0009]在本专利技术的另一个实施例中，根据所述搜索结果在所述网页中绘制关于所述关键字的高亮层包括：遍历所述搜索单元中的搜索结果，以获取所述关键字在所述网页的二维坐标系中的位置和占位信息；以及根据获取到的关键字在所述二维坐标系中的位置和占位信息绘制所述高亮层。
[0010]在本专利技术的又一个实施例中，获取所述关键字在所述网页的二维坐标系中的位置
和占位信息包括：创建关于所述搜索单元中每个搜索结果的范围Range对象；以及利用坐标获取接口获取Range对象范围下的所有内容的坐标信息列表，以实现对所述关键字在所述网页的二维坐标系中的位置和占位信息的获取。
[0011]在本专利技术的再一个实施例中，其中所述关键字在所述文档对象模型树中的位置信息包括所述关键字所匹配的开始文本节点、结束文本节点、在所述开始文本节点的文本内容中的起始位置和在所述结束文本节点的文本内容中的结束位置，创建关于所述搜索单元中每个搜索结果的范围Range对象包括：创建Range对象的范围；确定所述关键字所匹配的开始本文节点或在所述开始文本节点的文本内容中的起始位置为所述rang对象的起始位置；以及确定所述关键字所匹配的结束本文节点或在所述结束文本节点的文本内容中的结束位置为所述rang对象的结束位置。
[0012]在本专利技术的一个实施例中，根据获取到的关键字在所述二维坐标系中的位置和占位信息绘制所述高亮层包括：绘制至少覆盖在所述网页的搜索区域上方的高亮层，其中所述搜索区域包含有所述关键字；以及根据所述关键字在所述二维坐标系中的位置和占位信息，对所述高亮层进行调整，以基于调整后的高亮层对位于所述高亮层下方的关键字进行显示。
[0013]在本专利技术的另一个实施例中，绘制至少覆盖在所述网页的搜索区域上方的高亮层包括：创建关于所述高亮层的高亮容器及容器元素；以及对所述高亮容器和/或所述容器元素的属性进行调整，以使所述高亮层至少覆盖在所述搜索区域上方。
[0014]在本专利技术的在一个实施例中，对所述高亮层进行调整，以基于调整后的高亮层对位于所述高亮层下方的关键字进行显示包括：根据所述关键字在所述二维坐标系中的位置和占位信息，在所述高亮容器中添加高亮元素，以使所述高亮元素和所述关键字相融合、且同时显示。
[0015]在本专利技术的另一个实施例中，在所述高亮容器中添加高亮元素包括：创建所述高亮元素且将其添加至所述高层容器中；根据所述关键字在所述二维坐标系中的位置和占位信息，确定所述高亮元素在所述高亮容器中的位置和占位信息，以使所述高亮元素展示在所述高亮容器中、且覆盖在对应的关键字的上方；根据所述展示需求为所述高亮元素添加高亮展示样式；以及调整所述高亮元素的属性，以使所述高亮元素与其所覆盖的关键字相融合。
[0016]在本专利技术的又一个实施例中，其中所述容器元素填充有半透明或不透明的颜色，对所述高亮层进行调整，以基于调整后的高亮层对位于所述高亮层下方的关键字进行显示包括：根据所述关键字在所述二维坐标系中的位置和占位信息，清除所述高亮层中相应位置处的容器元素所填充的颜色，以显示所述高亮层下方的关键字。
[0017]在本专利技术的再一个实施例中，对所述高亮层进行调整，以基于调整后的高亮层对位于所述高亮层下方的关键字进行显示包括：根据所述关键字在所述二维坐标系中的位置和占位信息，对所述高亮层中相应位置处的容器元素进行颜色填充，以同时显示所填充的颜色和其下方的关键字。
[0018]在本专利技术实施方式的第二方面中，提供了一种设备，包括：处理器；以及存储器，其存储有用于对网页中关键字进行展示的计算机指令，当所述计算机指令由所述处理器运行时，使得所述设备执行根据前文以及下文多个实施例所述的方法。
[0019]在本专利技术实施方式的第三方面中，提供了一种计算机可读存储介质，包含用于对网页中关键字进行展示的程序指令，当所述程序指令由处理器执行时，使得所述设备执行根据前文以及下文多个实施例所述的方法。
[0020]根据本专利技术实施方式的用于对网页中关键字进行展示的方法及其相关产品，可以利用网页中关键字的搜索结果来绘制高亮层，以基于所绘制的高亮层来实现对关键字的展示。由此，可以在不改变搜索区域DOM结构的前提下实现对关键字的展示，从而有效避免DOM结构改变带来的副作用(例如导致所绑定的动作丢失等干扰其他业务的情况)。同时利用高亮层展示关键字时，对关键字的数量并无限制，可具体依据搜索结果来实现多个关键字的同时展示，从而满足用户的不同展示需求。在本专利技术的一些实施例中，可以依据与网页文本内容语义相关的搜索单元来获取搜索结果，可确保对关键字搜索的全面性以及精准性。
[0021]另外，在本专利技术的另一些实施例中，在调整高亮层过程中，可以通过对高亮元素的展示式样或填充颜色的调整，实现以不同颜色同时展示不同关键字。
[0022]此外，当所搜索的本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种用于对网页中关键字进行展示的方法，其特征在于，包括：响应于对所述网页中关键字的展示需求，获取关于所述关键字的搜索结果；以及根据所述搜索结果在所述网页中绘制关于所述关键字的高亮层，以完成对一个或多个所述关键字的展示。2.根据权利要求1所述的方法，其特征在于，其中所述搜索结果包括以搜索单元为单位获得的对关键字的搜索结果，每个所述搜索单元的搜索结果包括关键字和关键字在所述网页的HTML文档的文档对象模型树中的位置信息。3.根据权利要求2所述的方法，其特征在于，根据所述搜索结果在所述网页中绘制关于所述关键字的高亮层包括：遍历所述搜索单元中的搜索结果，以获取所述关键字在所述网页的二维坐标系中的位置和占位信息；以及根据获取到的关键字在所述二维坐标系中的位置和占位信息绘制所述高亮层。4.根据权利要求3所述的方法，其特征在于，获取所述关键字在所述网页的二维坐标系中的位置和占位信息包括：创建关于所述搜索单元中每个搜索结果的范围Range对象；以及利用坐标获取接口获取Range对象范围下的所有内容的坐标信息列表，以实现对所述关键字在所述网页的二维坐标系中的位置和占位信息的获取。5.根据权利要求3或4所述的方法，其特征在于，根据获取到的关键字在所述二维坐标系中的位置和占位信息绘制所述高亮层包括：绘制至少覆盖在所述网页的搜索区域上方的高亮层，其中所述搜索区域包含有所述关键字；以及根据所述关键字在所述二维坐标系中的位置和占位信息，对所述高亮层进行调整，以基于调整后的高亮层对位于所述...

【专利技术属性】
技术研发人员：傅云贵，
申请(专利权)人：网易有道信息技术北京有限公司，
类型：发明
国别省市：