一种对网页内容进行定位的方法、装置和存储介质

文档序号:1921742 发布日期:2021-12-03 浏览:17次 >En<

阅读说明:本技术 一种对网页内容进行定位的方法、装置和存储介质 (Method, device and storage medium for positioning webpage content ) 是由 姚凯 于 2020-05-29 设计创作,主要内容包括:本申请公开了一种对网页内容进行定位的方法、装置和存储介质,具体为首先在加载待定位网页时,实时获取待定位网页对应的文档对象,其次,遍历文档对象,并在文档对象中检索元素标签,进一步地,当检索到元素标签时,获取元素标签的位置信息和文本信息,最后,基于位置信息和文本信息,生成元素标签对应的锚点和锚链,并基于锚点和锚链对待定位网页上的元素标签进行定位。本申请实施例通过动态生成的待定位网页在不确定标题及内容的情况下依然可以动态生成锚点和锚链,减少开发者手动添加锚点和锚链的时间投入成本,有效提升业务快速上线时间,同时增加了用户侧的便利性和可操作性,提升了用户体验。(The application discloses a method, a device and a storage medium for positioning webpage content, and particularly relates to the steps of firstly obtaining a document object corresponding to a webpage to be positioned in real time when the webpage to be positioned is loaded, secondly traversing the document object, and searching an element label in the document object, further obtaining position information and text information of the element label when the element label is searched, and finally generating an anchor point and an anchor chain corresponding to the element label based on the position information and the text information, and positioning the element label on the webpage to be positioned based on the anchor point and the anchor chain. According to the embodiment of the application, the anchor points and the anchor chains can still be dynamically generated through the dynamically generated webpage to be positioned under the condition of uncertain titles and contents, the time input cost of manually adding the anchor points and the anchor chains by developers is reduced, the service quick online time is effectively improved, meanwhile, the convenience and operability of a user side are increased, and the user experience is improved.)

一种对网页内容进行定位的方法、装置和存储介质

技术领域

本申请涉及互联网技术领域,尤其涉及一种对网页内容进行定位的方法、装置和存储介质。

背景技术

随着现代互联网技术的发展,网页的内容越来越丰富,越来越长的网页可能会为用户的浏览造成困扰。针对该问题,一般会在Web页面下方设置点击模块或“返回顶部”的文本模块等,用户在点击后可以直接返回当前界面的顶部。另外,也可以根据当前页面的长度静态设置多处锚点和锚链,当点击相应锚链时跳转至锚点定位处。但点击模块直接跳到界面顶部存在功能单一的问题,且若页面较长且元素较复杂时并不能满足使用需求。另外,当页面数量多且内容及标题全部为动态生成时,静态设置设置的锚点和锚链可能无法及时满足动态需求。上述方法降低了用户的浏览体验。

发明内容

本申请实施例提供了一种对网页内容进行定位的方法,克服了无法为动态生成的网页进行定位的问题,且提升了用户的浏览体验。

该方法包括:

在加载待定位网页时,实时获取所述待定位网页对应的文档对象;

遍历所述文档对象,并在所述文档对象中检索元素标签;

当检索到所述元素标签时,获取所述元素标签的位置信息和文本信息;

基于所述位置信息和所述文本信息,生成所述元素标签对应的锚点和锚链,并基于所述锚点和锚链对所述待定位网页上的所述元素标签进行定位。

可选地,遍历所述文档对象,在所述文档对象中查找携带锚点标识的所述文档对象,并将携带所述锚点标识的所述文档对象确定为所述元素标签。

可选地,基于所述元素标签的所述文本信息生成与所述元素标签对应的所述锚点,并将所述锚点在前端进行展示;

基于所述元素标签的所述位置信息生成与所述元素标签对应的所述锚链,并将所述锚链与所述元素标签对应的所述锚点进行关联,其中,所述位置信息包括所述元素标签在所述待定位网页上的横坐标和纵坐标。

可选地,在用户点击所述锚点时,基于所述锚点对应的所述锚链中包含的所述标签元素对应在所述待定位网页上的滚动位置和偏移量,在所述待定位网页上为所述锚点对应的所述元素标签进行定位。

在本发明的另一个实施例中,提供了一种对网页内容进行定位的装置,该装置包括:

第一获取模块,用于在加载待定位网页时,实时获取所述待定位网页对应的文档对象;

检索模块,用于遍历所述文档对象,并在所述文档对象中检索元素标签;

第二获取模块,用于当检索到所述元素标签时,获取所述元素标签的位置信息和文本信息;

生成模块,用于基于所述位置信息和所述文本信息,生成所述元素标签对应的锚点和锚链,并基于所述锚点和锚链对所述待定位网页上的所述元素标签进行定位。

可选地,所述检索模块用于:

遍历所述文档对象,在所述文档对象中查找携带锚点标识的所述文档对象,并将携带所述锚点标识的所述文档对象确定为所述元素标签。

可选地,所述生成模块包括:

展示单元,用于基于所述元素标签的所述文本信息生成与所述元素标签对应的所述锚点,并将所述锚点在前端进行展示;

关联单元,用于基于所述元素标签的所述位置信息生成与所述元素标签对应的所述锚链,并将所述锚链与所述元素标签对应的所述锚点进行关联,其中,所述位置信息包括所述元素标签在所述待定位网页上的横坐标和纵坐标。

可选地,所述生成模块还包括:

定位单元,用于在用户点击所述锚点时,基于所述锚点对应的所述锚链中包含的所述标签元素对应在所述待定位网页上的滚动位置和偏移量,在所述待定位网页上为所述锚点对应的所述元素标签进行定位。

在本发明的另一个实施例中,提供了一种非瞬时计算机可读存储介质,所述非瞬时计算机可读存储介质存储指令,所述指令在由处理器执行时使得所述处理器执行上述一种对网页内容进行定位的方法中的各个步骤。

在本发明的另一个实施例中,提供了一种终端设备,包括处理器,所述处理器用于执行上述一种对网页内容进行定位的方法中的各个步骤。

基于上述实施例,首先在加载待定位网页时,实时获取待定位网页对应的文档对象,其次,遍历文档对象,并在文档对象中检索元素标签,进一步地,当检索到元素标签时,获取元素标签的位置信息和文本信息,最后,基于位置信息和文本信息,生成元素标签对应的锚点和锚链,并基于锚点和锚链对待定位网页上的元素标签进行定位。本申请实施例通过动态生成的待定位网页在不确定标题及内容的情况下依然可以动态生成锚点和锚链,减少开发者手动添加锚点和锚链的时间投入成本,有效提升业务快速上线时间,同时增加了用户侧的便利性和可操作性,提升了用户体验。

附图说明

为了更清楚地说明本申请实施例的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,应当理解,以下附图仅示出了本申请的某些实施例,因此不应被看作是对范围的限定,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他相关的附图。

图1示出了本申请实施例100所提供的一种对网页内容进行定位的方法的流程示意图;

图2示出了本申请实施例200提供的一种对网页内容进行定位的方法的具体流程的示意图;

图3示出了本申请实施例300还提供一种对网页内容进行定位的装置的示意图;

图4示出了本申请实施例400所提供的一种终端设备的示意图。

具体实施方式

下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。

本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”、“第三”、“第四”等(如果存在)是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本发明的实施例如能够以除了在这里图示或描述的那些以外的顺序实施。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含。例如,包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其他步骤或单元。

基于现有技术中的问题,本申请实施例提供了一种对网页内容进行定位的方法,主要适用于电子商务技术领域。通过在实时生成的网页上查找可生成锚点和锚链的元素标签,为动态生成的网页内的锚点和锚链,生成后的锚链以列表方式呈现,用户点击锚链可快速跳转至页面内不同模块的锚点处,以实现一种对网页内容进行定位的方法。以下几个具体实施例可以相互结合,对于相同或相似的概念或过程可能在某些实施例中不再赘述。如图1所示,为本申请实施例100提供的一种对网页内容进行定位的方法的流程示意图。其中,详细步骤如下:

S11,在加载待定位网页时,实时获取待定位网页对应的文档对象。

本步骤中,待定位网页可以为用户任意点开的Web页面。在加载待定位网页时,获取动态生成或展示的待定位页面上的文档对象。当创建好一个待定位网页并加载至浏览器时,对处理待定位网页对应的超级文本标记语言(Hyper Text Markup Language,HTML)或者可扩展标记语言(Extensible Markup Language,XML)进行解析后生成与待定位网页对应的文档对象,对文档对象进行操作以实现对待定位网页的操作。

S12,遍历文档对象,并在文档对象中检索元素标签。

本步骤中,在待定位网页中遍历文档对象,如基于设定的JavaScript函数在文档对象中检索相应的元素标签。其中,元素标签为可以后续可以生成锚点和锚链的文档对象。

S13,当检索到元素标签时,获取元素标签的位置信息和文本信息。

本步骤中,当检索到可以生成锚点和锚链的文档对象时,将该文档对象作为元素标签,并获取该元素标签在待定位网页中的位置信息和文本信息。其中,位置信息包括该元素标签在待定位网页中的横坐标和纵坐标,文本信息包括该标签对象的标签信息。

S14,基于位置信息和文本信息,生成元素标签对应的锚点和锚链,并基于锚点和锚链对待定位网页上的元素标签进行定位。

本步骤中,锚点作为网页制作中超级链接的一种,可以迅速定位页面内的超级链接。使用锚点可以在网页中设置标记,进一步地可以创建以这些锚点命名的链接,即锚链,以通过点击锚链快速将访问者带到指定位置。其中,可以利用元素标签对应的文本信息命名锚点,并可以将锚点设置在待定位网页页面的特定主题处或顶部。基于元素标签的位置信息,生成对应的锚链,并将锚链关联至元素标签对应的锚点。以基于锚点和锚链对待定位网页上的元素标签进行定位。

如上所述,基于上述实施例,首先在加载待定位网页时,实时获取待定位网页对应的文档对象,其次,遍历文档对象,并在文档对象中检索元素标签,进一步地,当检索到元素标签时,获取元素标签的位置信息和文本信息,最后,基于位置信息和文本信息,生成元素标签对应的锚点和锚链,并基于锚点和锚链对待定位网页上的元素标签进行定位。本申请实施例通过动态生成的待定位网页在不确定标题及内容的情况下依然可以动态生成锚点和锚链,减少开发者手动添加锚点和锚链的时间投入成本,有效提升业务快速上线时间,同时增加了用户侧的便利性和可操作性,提升了用户体验。

如图2所示,为本申请实施例200提供的一种对网页内容进行定位的方法的具体流程的示意图。其中,该具体流程的详细过程如下:

S201,加载待定位网页。

S202,遍历待定位网页上的文档对象。

这里,可以通过JavaScript函数对待定位网页进行遍历。具体的,JavaScript函数作为事件驱动的或者当它被调用时执行的可重复使用的代码块,通过设置JavaScript函数。当在遍历待定位网页时调用JavaScript函数,此时执行函数内的代码,执行JavaScript函数内预设操作。通过JavaScript函数遍历待定位网页上的Dom树。

S203,将携带锚点标识的文档对象确定为元素标签。

这里,遍历文档对象,在文档对象中查找携带锚点标识的文档对象,并将携带锚点标识的文档对象确定为元素标签。具体的,锚点标识可以为待定位网页上的具有H1-H6标签信息及Title信息,或者预先设置的携带锚点标识的文档对象。当查找到携带锚点标识的文档对象时,将该文档对象确定为元素标签。

S204,获取元素标签的位置信息和文本信息。

这里,获取元素标签在待生成网页中的位置信息包括元素标签在待定位网页上的横坐标和纵坐标。同时,获取元素标签的文本信息,如元素标签为H1-H6标签信息及Title信息时,获取该元素标签的标题信息。

S205,基于文本信息生成与元素标签对应的锚点。

这里,基于元素标签的文本信息生成与元素标签对应的锚点,并将锚点在前端进行展示。具体的,在获取到元素标签为H1-H6标签信息及Title信息时,基于H1-H6标签信息及Title文本信息判定是否具有锚点标识,获取该元素标签的标题信息,并开始执行生成逻辑,直到生成锚点。

S206,基于位置信息生成与元素标签对应的锚链。

这里,基于元素标签的位置信息生成与元素标签对应的锚链,并将锚链与元素标签对应的锚点进行关联,其中,位置信息包括元素标签在待定位网页上的横坐标和纵坐标。

S207,将锚点和锚链在前端进行展示。

这里,锚点可以在前端页面进行显示,用户通过浏览锚点并点击锚点,通过与锚点关联的锚链在待定位网页中进行定位。具体的,待定位页面的各个锚点可以组成锚点列表,该锚点列表可以在前端进行显示。当用户需要快速定位时,通过点击锚点触发显示已生成的锚链列表。另外,可以将锚链列表被设置为隐藏或以弹出层的方式呈现。锚点列表可以默认显示于待定位网页的右下角,也可以根据用户需要随意拖动至合适的位置,如根据用户拖动自动吸附于最贴近的上、下、左、右某一边显示。

S208,基于锚点和锚链对待定位网页上的元素标签进行定位。

这里,在用户点击锚点时,基于锚点对应的锚链中包含的标签元素对应在待定位网页上的滚动位置和偏移量,在待定位网页上为锚点对应的元素标签进行定位。具体的,通过对于锚链的滚动位置scroll和元素标签的偏移量offset两者的数据的比较,计算两者之间的差值来确定元素标签将要滑动的距离,将这部分按照实际的需求在确保用户感受到平滑的滚动原则下将其划分为若干部分,再通过系统的计时器来实现每一段的移动从而完成滚动。

本申请基于上述步骤实现一种对网页内容进行定位的方法。通过实时加载待定位网页后通过建立的JavaScript函数遍历待定位网页上的文档对象,检索文档对象是否为携带有锚点标识的H1-H6标签信息及Title信息,如检索到携带有锚点标识的文档对象时,则将检索出的元素标签如H1-H6标签信息及Title信息存储于本地localStorage,通过建立生成锚点、锚链读取localStorage存储的元素标签的位置信息,横坐标xpos和纵坐标ypos坐标、文本信息和offset、scroll值生成锚点、锚链,通过比较offset和scroll的值确定滑动方向,将生成的锚链插入页面的锚链列表弹层。进一步地,基于上述步骤显示出浮动于待定位网页右下角锚点列表,锚点列表默认显示于待定位网页右下角,可以根据用户需要随意拖动至合适的位置。锚点列表根据用户拖动自动吸附于最贴近的上、下、左、右某一边显示。当用户点击锚点列表时显示锚链列表弹层。通过前述方法为动态生成的待定位网页在不确定标题及内容的情况下依然可以动态生成锚点和锚链,减少开发者手动添加锚点和锚链的时间投入成本,有效提升业务快速上线时间,同时增加了用户侧的便利性和可操作性,提升了用户体验。

基于同一发明构思,本申请实施例300还提供一种对网页内容进行定位的装置,其中,如图3所示,该装置包括:

第一获取模块31,用于在加载待定位网页时,实时获取待定位网页对应的文档对象;

检索模块32,用于遍历文档对象,并在文档对象中检索元素标签;

第二获取模块33,用于当检索到元素标签时,获取元素标签的位置信息和文本信息;

生成模块34,用于基于位置信息和文本信息,生成元素标签对应的锚点和锚链,并基于锚点和锚链对待定位网页上的元素标签进行定位。

本实施例中,第一获取模块31、检索模块32、第二获取模块33和生成模块34的具体功能和交互方式,可参见图1对应的实施例的记载,在此不再赘述。

可选地,检索模块32用于:

遍历文档对象,在文档对象中查找携带锚点标识的所述文档对象,并将携带锚点标识的文档对象确定为元素标签。

可选地,生成模块34包括:

展示单元,用于基于元素标签的文本信息生成与元素标签对应的所述锚点,并将锚点在前端进行展示;

关联单元,用于基于元素标签的位置信息生成与元素标签对应的所述锚链,并将锚链与元素标签对应的锚点进行关联,其中,位置信息包括元素标签在待定位网页上的横坐标和纵坐标。

可选地,生成模块34还包括:

定位单元,用于在用户点击所述锚点时,基于锚点对应的锚链中包含的标签元素对应在待定位网页上的滚动位置和偏移量,在待定位网页上为锚点对应的元素标签进行定位。

如图4所示,本申请的又一实施例400还提供一种终端设备,包括处理器401,其中,处理器401用于执行上述一种对网页内容进行定位的方法的步骤。从图4中还可以看出,上述实施例提供的终端设备还包括非瞬时计算机可读存储介质402,该非瞬时计算机可读存储介质402上存储有计算机程序,该计算机程序被处理器401运行时执行上述一种对网页内容进行定位的方法的步骤。实际应用中,该终端设备可以是一台或多台计算机,只要包括上述计算机可读介质和处理器即可。

具体地,该存储介质能够为通用的存储介质,如移动磁盘、硬盘和FLASH等,该存储介质上的计算机程序被运行时,能够执行上述的一种对网页内容进行定位的方法中的各个步骤。实际应用中,所述的计算机可读介质可以是上述实施例中描述的设备/装置/系统中所包含的,也可以是单独存在,而未装配入该设备/装置/系统中。上述计算机可读存储介质承载有一个或者多个程序,当上述一个或多个程序被执行时,能够执行上述的一种对网页内容进行定位的方法中的各个步骤。

根据本申请公开的实施例,计算机可读存储介质可以是非易失性的计算机可读存储介质,例如可以包括但不限于:便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件,或者上述的任意合适的组合,但不用于限制本申请保护的范围。在本申请公开的实施例中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

本申请附图中的流程图和框图,示出了按照本申请公开的各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段、或者代码的一部分,上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应该注意,在有些作为替换的实现中,方框中所标注的功能也可以以不同附图中所标注的顺序发生。例如,两个连接地表示的方框实际上可以基本并行地执行,它们有时也可以按照相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图或流程图中的每个方框、以及框图或者流程图中的方框的组合,可以用执行规定的功能或操作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。

本领域技术人员可以理解,本公开的各个实施例和/或权利要求中记载的特征可以进行多种组合和/或结合,即使这样的组合或结合没有明确记载于本申请中。特别地,在不脱离本申请精神和教导的情况下,本申请的各个实施例和/或权利要求中记载的特征可以进行多种组合和/或结合,所有这些组合和/或结合均落入本申请公开的范围。

最后应说明的是:以上所述实施例,仅为本申请的具体实施方式,用以说明本申请的技术方案,而非对其限制,本申请的保护范围并不局限于此,尽管参照前述实施例对本申请进行了详细的说明,本领域的普通技术人员应当理解:任何熟悉本技术领域的技术人员在本申请揭露的技术范围内,其依然可以对前述实施例所记载的技术方案进行变更或可轻易想到变化,或者对其中部分技术特征进行等同替换;而这些变更、变化或者替换,并不使相应技术方案的本质脱离本申请实施例技术方案的精神和范围,都应涵盖在本申请的保护范围之内。因此,本申请的保护范围应所述以权利要求的保护范围为准。

13页详细技术资料下载
上一篇:一种医用注射器针头装配设备
下一篇:一种数据请求处理方法和装置

网友询问留言

已有0条留言

还没有人留言评论。精彩留言会获得点赞!

精彩留言,会给你点赞!