Internet page positioning method and device and electronic equipment

By displaying anchor buttons in the scroll area of ​​the Internet page and sliding the page, the problem of built-in anchor points cannot be customized is solved, the function of user-defined anchor points is realized, and the positioning accuracy and user experience is improved. It is suitable for a variety of purposes Front-end framework.

CN119166919APending Publication Date: 2024-12-20HILLSTONE NETWORKS CO LTD
View PDF 0 Cites 1 Cited by

Patent Information

Application Number
CN202411320157.2
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2024-09-20
Publication Date
2024-12-20

AI Technical Summary

Technical Problem

The built-in anchor points of existing Internet pages cannot effectively meet user needs and cannot implement user-defined anchor points, resulting in inconvenient positioning when browsing pages.

Method used

By displaying anchor buttons in the scrolling area and sliding the page when the user clicks to display the target object on the first line of the scrolling area, it supports the creation and destruction of user-defined anchor buttons, and uses the event bubble mechanism to avoid the original page. The impact of code, suitable for various front-end frameworks.

Benefits of technology

It realizes user-defined anchor points to ensure that the target object is displayed in the first line of the scrolling area, improving the positioning accuracy and user experience of the Internet page, and without intrusion into the original page code.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119166919A_ABST
    Figure CN119166919A_ABST
Patent Text Reader

Abstract

The invention discloses an internet page positioning method and device and electronic equipment. The method comprises the steps that page content and an anchor button of a target object are displayed in a scrolling area constructed for an original page, the scrolling area is used for sliding the page content in the original page, the anchor button links the position of the target object in the page content, and the target object is displayed in the scrolling area; the anchor point button is created in advance based on an anchor point creation instruction acting on a target object in the rolling area by a user; and under the condition that a click instruction for the anchor button is detected, controlling the scrolling area to slide the page so as to display the target object at a target position in the scrolling area. According to the method and the device, the purpose of customizing the anchor points for the Internet page is achieved, so that the effect of improving the user experience of Internet page positioning is achieved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of front-end development, and more specifically, to a method, device and electronic device for locating an Internet page. Background Art

[0002] An anchor is a locator in an Internet page. Through user operations, the current page can quickly reach a specified element in the page. An anchor consists of two parts. The first part is the element to be located, that is, a named anchor, such as the element at the top of the page or other important elements; the second part is the part that helps the Internet page to locate the named anchor. This part is a link tag with a hash (anchor) route attached, so it is called an anchor link. Comparing a web page to a document, a named anchor corresponds to the chapter title in the document, and an anchor link corresponds to the document's directory. By clicking on the directory, the document will jump to the specified chapter, and by clicking on the anchor link, the web page will scroll to the named anchor. Anchors can help users quickly locate the elements they are interested in on a web page. Most web pages provide the anchor function.

[0003] With the development of the Internet, web pages have become one of the main ways for users to obtain information. However, in the related art, most web pages are designed to investigate and evaluate the content that users care about, and then built into the page during development. The anchor points set during web page development often cannot truly meet the needs of users. If the content that users care about is not within the built-in anchor point range, it may cause inconvenience to the user's browsing. Summary of the invention

[0004] The main purpose of the present application is to provide a method, device and electronic device for locating an Internet page, so as to solve the problem in the related art that the page element positioning based on the built-in anchor point of the Internet page cannot effectively meet the user's needs.

[0005] In order to achieve the above-mentioned purpose, according to one aspect of the present application, a method for locating an Internet page is provided. The method comprises: displaying page content and an anchor button of a target object in a scrolling area constructed for an original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links the position of the target object in the page content, and the anchor button is pre-created based on an anchor creation instruction of a user acting on the target object in the scrolling area; when a click instruction on the anchor button is detected, controlling the scrolling area to slide the page to display the target object at a target position in the scrolling area.

[0006] Furthermore, the anchor button is created in the following manner: user events of all objects on the original page are delegated to the scrolling area through an event bubbling mechanism, wherein the user event is an operation instruction of the user on the object on the original page; an anchor creation instruction of the user for the target object in the scrolling area is received, and an anchor button of the target object is created in the scrolling area through the anchor creation instruction.

[0007] Furthermore, controlling the scrolling area to slide the page to display the target object at the target position in the scrolling area includes: determining the coordinates of the scrolling area on the browser, obtaining the coordinates of the scrolling area, determining the object coordinates of the target object on the browser, and determining the first coordinate offset of the top of the original page relative to the scrolling area before sliding, wherein, when the scrolling direction of the page is vertical, the coordinates of the scrolling area are the longitudinal coordinates of the scrolling area on the browser, and the object coordinates are the longitudinal coordinates of the target object on the browser, and when the scrolling direction of the page is horizontal, the coordinates of the scrolling area are the transverse coordinates of the scrolling area on the browser, and the object coordinates are the transverse coordinates of the target object on the browser; calculating the target coordinate offset of the target object relative to the scrolling area based on the coordinates of the scrolling area, the object coordinates and the first coordinate offset; controlling the page in the scrolling area to slide according to the target coordinate offset to display the target object at the target position of the scrolling area.

[0008] Furthermore, calculating the target coordinate offset of the target object relative to the scrolling area based on the coordinates of the scrolling area, the object coordinates and the first coordinate offset includes: determining the first coordinate value of the coordinates of the scrolling area and the second coordinate value of the object coordinates, and calculating the absolute value of the difference between the first coordinate value and the second coordinate value to obtain the coordinate difference; judging whether the first coordinate value is greater than the second coordinate value; when the first coordinate value is greater than the second coordinate value, calculating the difference between the first coordinate offset and the coordinate difference to obtain the target coordinate offset; when the first coordinate value is less than or equal to the second coordinate value, calculating the sum of the first coordinate offset and the coordinate difference to obtain the target coordinate offset.

[0009] Furthermore, before controlling the page in the scrolling area to slide according to the target coordinate offset, the method also includes: determining the total length of the original page, calculating the difference between the total length and the target coordinate offset, and obtaining the relative distance of the target object relative to the end of the original page, wherein when the scrolling direction of the page is vertical, the total length is the height of the original page on the browser, and when the scrolling direction of the page is horizontal, the total length is the width of the original page on the browser; determining whether the first coordinate value of the coordinate of the scrolling area is greater than the relative distance; and executing the step of controlling the page in the scrolling area to slide according to the target coordinate offset when the first coordinate value is less than or equal to the relative distance.

[0010] Furthermore, the method also includes: when the first coordinate value is greater than the relative distance, calculating the sum of the first coordinate value and the target coordinate offset, and calculating the difference between the sum and the total length to obtain the target length; setting the length of the filling node in the scrolling area as the target length, calculating the sum of the target length and the target coordinate offset to obtain the updated target coordinate offset, and controlling the page in the scrolling area to slide according to the updated target coordinate offset, wherein the filling node is a node with a preset length as an initial value at the end of the scrolling area, and the filling node is used to fill the gap between the end of the scrolling area and the target object to display the target object at the target position of the scrolling area.

[0011] Furthermore, the method also includes: when detecting the first click event of the user on the target object, determining whether there is a selected character in the scrolling area; when there is a selected character in the scrolling area, determining whether the first click event clicked on the selected character; when the first click event clicked on the selected character, preventing the first click event from bubbling on the original page, storing the target object in the database of anchor points to be created, and displaying the anchor point creation menu in the scrolling area.

[0012] Furthermore, the method also includes: when a user click event on the anchor creation menu is detected, determining the target character selected by the user; generating a button name of the anchor button based on the target character, creating an anchor button in the scrolling area with the button name displayed in the scrolling area, and linking the anchor button with the target object.

[0013] Furthermore, the method further includes: after displaying the page content and the anchor button of the target object in the scrolling area constructed for the original page, the method further includes: receiving a user's destruction instruction for the anchor button, and removing the anchor button from the scrolling area based on the destruction instruction.

[0014] Furthermore, the method also includes: when a second click event of the user on the scrolling area is detected, or when it is detected that the user's cursor indicates an area other than the scrolling area of ​​the original page, removing the target object from the database of anchor points to be created and hiding the anchor point creation menu.

[0015] In order to achieve the above-mentioned purpose, according to another aspect of the present application, a device for positioning an Internet page is provided. The device comprises: a display unit, which is used to display the page content and the anchor button of the target object in the scrolling area constructed for the original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links the position of the target object in the page content, and the anchor button is pre-created based on the anchor creation instruction of the user acting on the target object in the scrolling area; and a control unit, which is used to control the scrolling area to slide the page when a click instruction to the anchor button is detected, so as to display the target object at the target position in the scrolling area.

[0016] In order to achieve the above-mentioned purpose, according to another aspect of the present application, a computer program product is provided, including a computer program, which, when executed by a processor, implements the steps of the method for locating an Internet page described in each embodiment of the present application.

[0017] According to another aspect of an embodiment of the present application, an electronic device is also provided, which includes one or more processors; a storage device for storing one or more programs, which, when the one or more programs are executed by the one or more processors, enables the one or more processors to run the programs, wherein the programs are configured to execute the above-mentioned method for locating Internet pages when running.

[0018] An embodiment of the present application displays page content and an anchor button of a target object in a scrolling area constructed for an original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links to the position of the target object in the page content, and the anchor button is created in advance based on an anchor creation instruction performed by a user on the target object in the scrolling area; when a click instruction on the anchor button is detected, the scrolling area is controlled to slide the page to display the target object at the target position in the scrolling area.

[0019] As can be seen from the above content, the method for locating an Internet page proposed in the present application, compared with the method for locating an Internet page through the hash (anchor) component of a URI (Uniform Resource Identifier) ​​in the related art, supports user-defined anchor points. In the process of browsing Internet pages, users can add new target objects at any time and build anchor buttons for target objects for subsequent users to quickly locate the target objects. When locating the target object to the scrolling area, it can be ensured that the target object must be in the first row of the scrolling area, which is convenient for users to accurately locate. In addition, the method for locating an Internet page in the present application does not rely on a specific front-end framework. Whether the framework uses server-side routing or front-end routing (hash routing or history routing), the method can support it. The method for locating an Internet page in the present application can achieve zero intrusion on the business code of the original Internet page.

[0020] It can be seen that the technical solution of the present application achieves the purpose of customizing anchor points for Internet pages, thereby realizing the effect of improving the user experience of Internet page positioning, and further solving the technical problem in the related technology that the page element positioning implemented based on the built-in anchor points of Internet pages cannot effectively meet user needs. BRIEF DESCRIPTION OF THE DRAWINGS

[0021] The drawings constituting a part of the present application are used to provide a further understanding of the present application. The illustrative embodiments and descriptions of the present application are used to explain the present application and do not constitute an improper limitation on the present application. In the drawings:

[0022] Figure 1 is a structural schematic diagram of a page positioning device provided according to an embodiment of the present application;

[0023] Figure 2 is a schematic diagram of browsing a web page through a page positioning device provided according to an embodiment of the present application;

[0024] Figure 3 is a flow chart of a method for locating an Internet page provided according to an embodiment of the present application;

[0025] Figure 4 is a schematic diagram of a page with a target object above a baseline provided in an embodiment of the present application;

[0026] Figure 5 is a schematic diagram of a page with a target object below a baseline provided in an embodiment of the present application;

[0027] Figure 6 is a schematic diagram of a page with a target object on the left side of a baseline according to an embodiment of the present application;

[0028] Figure 7 is a schematic diagram of a page with a target object on the right side of a baseline according to an embodiment of the present application;

[0029] Figure 8 is a schematic diagram of positioning a target object to a target position in a scrolling area according to an embodiment of the present application;

[0030] Fig. 9 is a flow chart of monitoring click events of an original page provided according to an embodiment of the present application;

[0031] Fig.10 is a schematic diagram of a positioning device for an Internet page provided according to an embodiment of the present application;

[0032] Fig.11 is a schematic diagram of an electronic device provided according to an embodiment of the present application. DETAILED DESCRIPTION

[0033] It should be noted that, in the absence of conflict, the embodiments and features in the embodiments of the present application can be combined with each other. The present application will be described in detail below with reference to the accompanying drawings and in combination with the embodiments.

[0034] In order to enable those skilled in the art to better understand the solution of the present application, the technical solution in the embodiments of the present application will be clearly and completely described below in conjunction with the drawings in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in this field without creative work should fall within the scope of protection of the present application.

[0035] It should be noted that the terms "first", "second", etc. in the specification and claims of the present application and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequential order. It should be understood that the data used in this way can be interchanged where appropriate, so that the embodiments of the present application described here. In addition, the terms "including" and "having" and any of their variations are intended to cover non-exclusive inclusions, for example, a process, method, system, product or device comprising a series of steps or units is not necessarily limited to those steps or units clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products or devices.

[0036] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data for display, data for analysis, etc.) involved in this disclosure are all information and data authorized by the user or fully authorized by all parties.

[0037] It should be noted that the information collected is information and data authorized by the user or fully authorized by all parties, and the collection, storage, use, processing, transmission, provision, disclosure and application of relevant data comply with the relevant laws, regulations and standards of the relevant regions, take necessary confidentiality measures, do not violate public order and good customs, and provide corresponding operation entrances for users to choose to authorize or refuse.

[0038] It should be noted that the embodiments or examples of the present disclosure are not exhaustive, but are only illustrative of some embodiments or examples, and are not intended to be specific limitations on the scope of protection of the present disclosure. In the absence of contradiction, each step in a certain embodiment or example can be implemented as an independent example, and the steps can be combined arbitrarily. For example, the scheme after removing some steps in a certain embodiment or example can also be implemented as an independent example, and the order of the steps in a certain embodiment or example can be arbitrarily exchanged. In addition, the optional methods or optional examples in a certain embodiment or example can be combined arbitrarily; in addition, the various embodiments or examples can be combined arbitrarily, for example, some or all steps of different embodiments or examples can be combined arbitrarily, and a certain embodiment or example can be combined arbitrarily with the optional methods or optional examples of other embodiments or examples.

[0039] In order to solve the problem in the related art that the page element positioning based on the built-in anchor point of the Internet page cannot effectively meet the user's needs, the following method can be used:

[0040] According to one embodiment of the present application, a hash-based anchor positioning method is provided, the method comprising: defining a fragment component (a user interface component) of a universal uniform resource identifier in RFC3986 (a uniform resource locator specification), generally also referred to as a hash or anchor, which starts with the character "#" and ends with the end of the URI.

[0041] The hash component of the URI allows the indirect identification of secondary resources by referencing the primary resource and additional identification information. The identified secondary resource is a part or subset of the primary resource. Major browsers currently implement the hash function of the URI, that is, the hash-based anchor positioning method.

[0042] When using this method, you need to configure the id attribute for the target object and bind this id to the link tag.

[0043] However, the target object and anchor button in the solution of this embodiment need to be built-in and cannot be customized by the user. The hash component of URI is used, but as complex single-page application technology becomes more and more popular, the hash components of many pages are used by the front-end routing to associate the various sub-modules of the page. In this framework, this solution cannot be used. It can only ensure that the target object appears in the scrolling area, but it cannot be guaranteed to be in the first line of the scrolling area. If the target object is near the end of the original page, the user needs to scan the scrolling area to confirm the exact position of the target object.

[0044] Based on this, the present application hopes to provide a solution that can solve the above-mentioned technical problems, the details of which will be described in the subsequent embodiments.

[0045] Example 1

[0046] According to an embodiment of the present application, a page positioning device embodiment is provided. Figure 1 is a schematic diagram of the structure of a page positioning device provided according to an embodiment of the present application, such as Figure 1 As shown, the device mainly includes four modules: an initialization unit 101, an anchor point creation unit 102, an anchor point positioning unit 103 and an anchor point destruction unit 104.

[0047] Initialization unit 101 is responsible for organizing the hierarchical structure of the Internet page and doing some preparatory work after the page is loaded, mainly including: building a container node for the original page as the scrolling area of ​​the original page. Building a custom right-click menu and hiding it by default. The menu node provides a function entry for generating an anchor button. Adding a transparent filler node with a height of 0 to the end of the container node. Traversing all child nodes of the container node, calculating the sum of the heights of each node, that is, the total height of the original page, and saving it.

[0048] The function of the anchor construction module 102 is to monitor and respond to the user's mouse events to achieve the selection of the target object and the construction of the anchor button. It mainly monitors four events: the mouse move-out event of the container node, the left-click event of any child node in the original page, the right-click event of any child node in the original page, and the left-click event of the custom menu.

[0049] The function of the anchor point positioning unit 103 is to quickly position the target object to the first line of the scrolling area by monitoring and responding to the left mouse button click event of the anchor point button.

[0050] The function of the anchor point destroying unit 104 is to destroy the button by monitoring and responding to the right click event of the anchor point button. When the user clicks the right mouse button on the anchor point button, the device pops up a confirmation box, and if the user confirms, the button is destroyed.

[0051] The page positioning device provided in this embodiment supports user-defined anchor points, allowing users to select named anchors in the scrolling area, dynamically create anchor links, and click on the anchor links to position the named anchors to the first line of the scrolling area. At the same time, the device can also achieve zero intrusion on the original page code, reduce the workload of developers, and facilitate use. It should be noted that the page positioning device does not rely on URIs and is applicable to all front-end frameworks, such as frameworks of complex single-page applications that use hash routing switching modules, and can also use the device.

[0052] This device is suitable for text reading websites with a large amount of information, such as help documents, Wikipedia, blogs, document libraries, etc. By using this device to wrap the original page code, users can customize anchor points to facilitate quick positioning during subsequent browsing. Figure 2 is a schematic diagram of browsing a web page through a page positioning device provided in an embodiment of the present application, such as Figure 2 As shown, the original webpage is an ancient poetry reading webpage. Figure 2 The left side is the content of the original web page wrapped in the container constructed by the page positioning device, and the right side is the original content. There is no difference in user presentation, but user-defined anchor points can be added on the left side. The anchor point button is in the lower left corner of the scrolling area. By clicking the custom anchor point, you can quickly locate the position of the anchor point link. For example, the user sets Ancient Poetry 3 as the anchor point, and by clicking the anchor point button of Ancient Poetry 3 in the lower left corner, the left page automatically slides within the scrolling area of ​​the container to the position of Ancient Poetry 3 located in the first line of the scrolling area.

[0053] This embodiment also provides a method for locating an Internet page using the page locating device. The present invention is described below in conjunction with preferred implementation steps. Figure 3 is a flow chart of a method for locating an Internet page according to an embodiment of the present application, such as Figure 3 As shown, the method comprises the following steps:

[0054] Step S301, displaying the page content and the anchor button of the target object in the scrolling area constructed for the original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links to the position of the target object in the page content, and the anchor button is created in advance based on the anchor creation instruction performed by the user on the target object in the scrolling area.

[0055] In step S301, the original page may be an Internet page containing a large amount of information. The original page contains various elements. In the code of the original page, nodes on a tree structure correspond to various elements. A scrolling area is constructed on the original page through the initialization unit 101 in the page positioning device. The page positioning device may exist in the form of a custom HTML (HyperTextMarkup Language) tag, which can construct a container for the original page as a scrolling area. The code of the original page is wrapped with the tag. Without intruding the code of the original page, the original page can use the custom anchor function of the page positioning device.

[0056] The anchor creation instruction can be an instruction triggered by the user through keyboard and mouse operations on the original page. For example, the user can select part of the content in the web page in the scrolling area and click the right button of the mouse. The page will pop up a customized right-click menu pre-constructed by the initialization unit 101 of the page positioning device, that is, the anchor creation menu. The user clicks the anchor creation button on the anchor creation menu, and the page positioning device will generate a floating anchor button on the original page. The anchor button is associated with the target object (that is, the element selected by the user in the scrolling area). The creation of the anchor button can be repeated to generate multiple anchor buttons associated with the target object.

[0057] Step S302: When a click instruction on the anchor button is detected, the scrolling area is controlled to slide the page so as to display the target object at a target position in the scrolling area.

[0058] In step S302, during the subsequent page browsing process, the user can left-click the created anchor button, and the page positioning device will control the scrolling area to slide the page, thereby positioning the target object to the target position of the scrolling area to facilitate the user's browsing. The target position can be any position in the scrolling area and can be adjusted manually, for example, the target position can be set to the first line of the scrolling area.

[0059] An embodiment of the present application displays page content and an anchor button of a target object in a scrolling area constructed for an original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links to the position of the target object in the page content, and the anchor button is created in advance based on an anchor creation instruction performed by a user on the target object in the scrolling area; when a click instruction on the anchor button is detected, the scrolling area is controlled to slide the page to display the target object at the target position in the scrolling area.

[0060] As can be seen from the above content, the method for locating an Internet page proposed in this application, compared with the method for locating an Internet page by using the hash (anchor) component of the URL (Uniform Resource Locator) in the related art, supports user-defined anchor points. In the process of browsing Internet pages, users can add new target objects at any time and build anchor buttons for target objects for subsequent users to quickly locate the target objects. When locating the target object to the scrolling area, it can ensure that the target object must be in the first row of the scrolling area, which is convenient for users to accurately locate. In addition, the method for locating the Internet page of this application does not rely on a specific front-end framework. Whether the framework uses server-side routing or front-end routing (hash routing or history routing), this method can support it. The method for locating the Internet page of this application can achieve zero intrusion on the business code of the original Internet page.

[0061] It can be seen that the technical solution of the present application achieves the purpose of customizing anchor points for Internet pages, thereby realizing the effect of improving the user experience of Internet page positioning, and further solving the technical problem in the related technology that the page element positioning implemented based on the built-in anchor points of Internet pages cannot effectively meet user needs.

[0062] In order to help users quickly locate the target object, an anchor button is created in the scrolling area based on the user's anchor creation instruction. Optionally, the anchor button is created in the following way: user events of all objects on the original page are delegated to the scrolling area through an event bubbling mechanism, wherein the user event is the user's operation instruction on the object on the original page; receiving the user's anchor creation instruction for the target object in the scrolling area, and creating an anchor button for the target object in the scrolling area through the anchor creation instruction.

[0063] In some examples, the event bubbling mechanism means that when an event is triggered on an element (ie, object) in the DOM tree (Document Object Model) of the original page, the event will propagate from the triggered element to the upper node of the DOM tree until the root node. In this process, each ancestor element will receive the event and can process or modify the event. In order to avoid the impact of creating an anchor button on the code of the original page, the user events of all objects of the original page are delegated to the scrolling area, and then the container corresponding to the scrolling area constructed based on the page positioning device prevents the user event from bubbling to the upper node of the original page when the anchor button is created.

[0064] The user can create an anchor button of the target object in the scrolling area by issuing an anchor creation instruction for any object in the scrolling area. Since the user events of all objects on the original page are delegated to the scrolling area in advance through the event bubbling mechanism, after the anchor button is created, the user clicks the anchor button to slide the scrolling area and display the target object at the target position in the scrolling area. The click event of the anchor button will not bubble up the nodes on the DOM tree of the original page and will not affect the code of the original page.

[0065] This embodiment delegates the user events of all objects of the original page to the scrolling area through the event bubbling mechanism, avoiding the operation of adding an anchor button to affect the code of the original page. It also allows users to customize anchors in the scrolling area, improving the user experience of Internet page positioning.

[0066] The target object is displayed at the target position by sliding the page to the target coordinate offset. Optionally, in the positioning method of the Internet page provided in the embodiment of the present application, controlling the scrolling area to slide the page to display the target object at the target position in the scrolling area includes: determining the coordinates of the scrolling area on the browser, obtaining the coordinates of the scrolling area, determining the object coordinates of the target object on the browser, and determining the first coordinate offset of the top of the original page relative to the scrolling area before sliding, wherein, when the scrolling direction of the page is vertical, the coordinates of the scrolling area are the longitudinal coordinates of the scrolling area on the browser, and the object coordinates are the longitudinal coordinates of the target object on the browser, and when the scrolling direction of the page is horizontal, the coordinates of the scrolling area are the transverse coordinates of the scrolling area on the browser, and the object coordinates are the transverse coordinates of the target object on the browser; calculating the target coordinate offset of the target object relative to the scrolling area based on the coordinates of the scrolling area, the object coordinates and the first coordinate offset; controlling the page in the scrolling area to slide according to the target coordinate offset to display the target object at the target position of the scrolling area.

[0067] In some examples, the target position may be the first line of the scrolling area, and the target object may be quickly positioned to the first line of the scrolling area by the anchor point positioning unit 103 in the page positioning device monitoring and responding to the click event of the anchor point button.

[0068] In Internet pages, the default pixel coordinate system is a rectangular coordinate system with the upper left corner of the browser as the origin, the right as the positive direction of the X axis, and the downward as the positive direction of the Y axis. Each element in the page occupies a rectangular area, and the coordinates of the element refer to the coordinates of the pixels in the upper left corner of the rectangular area. The scrolling method of the page in the scrolling area can be either vertical or horizontal. For example, when the scrolling direction of the page is vertical, the top of the scrolling area is used as the baseline. Before the page in the scrolling area is controlled to slide, there are two states of the page elements: first, the target object is above the baseline before the page slides; second, the target object is below the baseline before the page slides.

[0069] Figure 4 is a schematic diagram of a page with a target object above a baseline provided in an embodiment of the present application, Figure 5 is a schematic diagram of a page with a target object below a baseline provided in an embodiment of the present application, such as Figure 4 and Figure 5 As shown, scrollHeight is the height of the scrolling area, contentHeight is the sum of the heights of all nodes in the original page (calculated and saved by the initialization unit 101 in the page positioning device), that is, the total height of the original page, y1 is the y-axis coordinate of the scrolling area, y2 is the y-axis coordinate of the target object, that is, the object coordinate, offsetY1 is the y-axis offset of the top of the original page relative to the scrolling area before sliding, that is, the first coordinate offset, and offsetY2 is the y-axis offset of the target object relative to the scrolling area, which is also the target coordinate offset that needs to be calculated. After calculating the target coordinate offset, the page in the scrolling area is controlled by the page positioning device to slide according to the target coordinate offset, so that the target object is displayed in the first line of the scrolling area.

[0070] When the scrolling direction of the page is horizontal, with the left end of the scrolling area as the baseline, there are two states of the page elements before the page that controls the scrolling area slides. The first state is: the target object is on the left side of the baseline before the page slides; the second state is: the target object is on the right side of the baseline before the page slides.

[0071] Figure 6 is a schematic diagram of a page with a target object on the left side of a baseline according to an embodiment of the present application, Figure 7 is a schematic diagram of a page with a target object on the right side of the baseline according to an embodiment of the present application, such as Figure 6 and Figure 7As shown, scrollWeight is the width of the scrolling area, contentWeight is the sum of the widths of all nodes in the original page (calculated and saved by the initialization unit 101 in the page positioning device), that is, the total width of the original page, x1 is the x-axis coordinate of the scrolling area, x2 is the x-axis coordinate of the target object, that is, the object coordinate, offsetX1 is the x-axis offset of the left end of the original page relative to the scrolling area before sliding, that is, the first coordinate offset, and offsetX2 is the x-axis offset of the target object relative to the scrolling area, which is also the target coordinate offset that needs to be calculated. After calculating the target coordinate offset, the page in the scrolling area is controlled by the page positioning device to slide according to the target coordinate offset, so that the target object is displayed in the first column of the scrolling area.

[0072] This embodiment calculates the target coordinate offset and controls the page in the scrolling area to slide according to the target coordinate offset, thereby ensuring that the target object is positioned at the target position of the scrolling area, and facilitating the user to quickly and accurately position the Internet page.

[0073] In order to display the target object at the target position of the scrolling area, it is necessary to calculate the target coordinate offset. Optionally, in the positioning method of the Internet page provided in the embodiment of the present application, the target coordinate offset of the target object relative to the scrolling area is calculated based on the coordinates of the scrolling area, the object coordinates and the first coordinate offset, including: determining the first coordinate value of the coordinates of the scrolling area and the second coordinate value of the object coordinates, and calculating the absolute value of the difference between the first coordinate value and the second coordinate value to obtain the coordinate difference; judging whether the first coordinate value is greater than the second coordinate value; when the first coordinate value is greater than the second coordinate value, calculating the difference between the first coordinate offset and the coordinate difference to obtain the target coordinate offset; when the first coordinate value is less than or equal to the second coordinate value, calculating the sum of the first coordinate offset and the coordinate difference to obtain the target coordinate offset.

[0074] In some examples, the target coordinate offset is calculated in different ways according to the status of different page elements. When the scrolling direction of the page is vertical, such as Figure 4 As shown in , when the target object is above the baseline, that is, when the first coordinate value is greater than the second coordinate value, the calculation formula of the target coordinate offset is offsetY2=offsetY1-(y1-y2). Figure 5 As shown in the figure, when the target object is below the baseline, that is, when the first coordinate value is less than or equal to the second coordinate value, the calculation formula of the target coordinate offset is offsetY2=offsetY1+(y2-y1). Among them, the first coordinate value is y1, and the second coordinate value is y2. The coordinate difference is the absolute value of y1-y2 or the absolute value of y2-y1.

[0075] When the scrolling direction of the page is horizontal, such as Figure 6 As shown in , when the target object is on the left side of the baseline, that is, when the first coordinate value is greater than the second coordinate value, the calculation formula of the target coordinate offset is offsetX2=offsetX1-(x1-x2). Figure 7 As shown, when the target object is on the right side of the baseline, that is, when the first coordinate value is less than or equal to the second coordinate value, the calculation formula of the target coordinate offset is offsetX2=offsetX1+(x2-x1). Among them, the first coordinate value is x1, and the second coordinate value is x2. The coordinate difference is the absolute value of x1-x2 or the absolute value of x2-x1.

[0076] This embodiment calculates the target coordinate offset based on the coordinates of the scrolling area, the object coordinates and the first coordinate offset, thereby determining the position to which the page in the scrolling area needs to slide, ensuring that the target object appears at the target position in the scrolling area after the user clicks the anchor button.

[0077] If the position of the target object in the original page is close to the boundary of the original page, it is necessary to display the target object at the target position by filling in nodes when sliding the page in the scrolling area. Optionally, in the positioning method of an Internet page provided in an embodiment of the present application, before controlling the page in the scrolling area to slide according to the target coordinate offset, the method also includes: determining the total length of the original page, calculating the difference between the total length and the target coordinate offset, and obtaining the relative distance of the target object relative to the end of the original page, wherein when the scrolling direction of the page is vertical, the total length is the height of the original page on the browser, and when the scrolling direction of the page is horizontal, the total length is the width of the original page on the browser; determining whether the first coordinate value of the coordinate of the scrolling area is greater than the relative distance; and when the first coordinate value is less than or equal to the relative distance, executing the step of controlling the page in the scrolling area to slide according to the target coordinate offset.

[0078] In some examples, when the first coordinate value is greater than the relative distance, the sum of the first coordinate value and the target coordinate offset is calculated, and the difference between the sum and the total length is calculated to obtain the target length; the length of the filling node in the scrolling area is set to the target length, the sum of the target length and the target coordinate offset is calculated to obtain the updated target coordinate offset, and the page in the scrolling area is controlled to slide according to the updated target coordinate offset, wherein the filling node is a node with a preset length as an initial value at the end of the scrolling area, and the filling node is used to fill the gap between the end of the scrolling area and the target object to display the target object at the target position of the scrolling area.

[0079] It should be noted that if the relative distance between the target object and the end of the original page is less than the length of the scrolling area (that is, the first coordinate value), the calculated target coordinate offset cannot position the target object to the target position of the scrolling area, and the length of the filling node needs to be dynamically adjusted to support the target object to the target position of the scrolling area.

[0080] When the scrolling direction of the page is vertical, Figure 8 is a schematic diagram of positioning a target object to a target position of a scrolling area according to an embodiment of the present application, such as Figure 8 As shown, after receiving the click event of the anchor button, the first coordinate value is compared with the second coordinate value. If the first coordinate value is greater than the second coordinate value, the target coordinate offset is calculated by offsetY2=offsetY1-(y1-y2). If the first coordinate value is less than or equal to the second coordinate value, the target coordinate offset is calculated by offsetY2=offsetY1+(y2-y1).

[0081] After calculating the target coordinate offset, determine whether scrollHeight (that is, the first coordinate value when the scrolling direction of the page is vertical) is greater than contenHeight-offsetY2 (that is, the relative distance). If the first coordinate value is greater than the relative distance, sliding the page in the scrolling area to the target coordinate offset cannot position the target object to the target position, and it is necessary to set the target height for the filling node, that is, scrollHeight+offsetY2-contenHeight. Then control the page in the scrolling area to slide to offsetY2+scrollHeight+offsetY2-contenHeight, that is, the updated target coordinate offset, to ensure that the target object is positioned at the target position. If the first coordinate value is less than or equal to the relative distance, it means that the target object can be positioned at the target position without setting the height of the filling node. At this time, directly control the page in the scrolling area to slide to offsetY2.

[0082] When the scrolling direction of the page is horizontal, after receiving the click event of the anchor button, first compare the first coordinate value with the second coordinate value. If the first coordinate value is greater than the second coordinate value, use offsetX2=offsetX1-(x1-x2) to calculate the target coordinate offset. If the first coordinate value is less than or equal to the second coordinate value, use offsetX2=offsetX1+(x2-x1) to calculate the target coordinate offset.

[0083] After calculating the target coordinate offset, determine whether scrollWeight (that is, the first coordinate value when the scrolling direction of the page is horizontal) is greater than contenWeight-offsetX2 (that is, the relative distance). If the first coordinate value is greater than the relative distance, sliding the page in the scrolling area to the target coordinate offset cannot position the target object to the target position, and it is necessary to set the target width for the fill node, that is, scrollWeight+offsetX2-contenWeight. Then control the page in the scrolling area to slide to offsetX2+scrollWeight+offsetX2-contenWeight, that is, the updated target coordinate offset, to ensure that the target object is positioned at the target position. If the first coordinate value is less than or equal to the relative distance, it means that the target object can be positioned at the target position without setting the height of the fill node. At this time, directly control the page in the scrolling area to slide to offsetX2.

[0084] This embodiment ensures that the target object is located at the target position of the scrolling area each time by setting a filling node and dynamically calculating the height of the compensation node during the process of scrolling and positioning the page.

[0085] In order to create an anchor button, it is also necessary to monitor the click events of the original page. Optionally, in the Internet page positioning method provided in the embodiment of the present application, the method also includes: when detecting the first click event of the user on the target object, judging whether there is a selected character in the scrolling area; when there is a selected character in the scrolling area, judging whether the first click event clicked on the selected character; when the first click event clicked on the selected character, preventing the first click event from bubbling on the original page, storing the target object in the anchor database to be created, and displaying the anchor creation menu in the scrolling area.

[0086] In some examples, the first click event may be a right-click event of a mouse. Fig. 9 is a flow chart of monitoring click events of the original page provided according to an embodiment of the present application, such as Fig. 9 As shown, after the original page detects the right-click event of the user on the target object through the page positioning device, it is necessary to first determine whether there is a selected character selected by the user in advance in the scrolling area. If there is no selected character, the default right-click menu (that is, the default menu) is directly displayed. The default right-click menu means that when you right-click the mouse on the Internet page, the browser will pop up a default menu node, providing a menu with functions including forward, background, reload, view source code, etc. If there is a selected character, it is necessary to determine whether the first click event clicks on the selected character. If it is not a selected character, it means that the user is not operating the selected character, so the selected area will be cleared on the original page and the default menu will be displayed at the same time.

[0087] If the first click event clicks on the selected character, it means that the user may need to create an anchor button for the selected character. At this time, it is necessary to prevent the first click event from bubbling on the original page. The bubbling mechanism of the page means that when an event is triggered on an element in the DOM (Document Object Model) tree of the original page, the event will propagate from the triggered element to the upper node of the DOM tree until the root node. In this process, each ancestor element will receive this event and can process or modify the event. In order to avoid the impact of creating an anchor button on the code of the original page, the container constructed by the page positioning device prevents the click event from bubbling to the upper node of the original page when creating the anchor button.

[0088] After preventing the first click event from bubbling on the original page, the target object is temporarily stored in the anchor database to be created in the page positioning device, and a custom right-click menu (i.e., anchor creation menu) is displayed in the scrolling area for the user to create an anchor button.

[0089] It should be noted that the selected character is the content of interest selected by the user through the mouse in the original page. When calling the anchor creation menu, the mouse must be on the selected character to ensure that the target object of the mouse event is consistent with the selected character. The container node and the custom right-click menu are both constructed by the initialization unit 101 of the page positioning device. The response event can be directly mounted on the node itself, but the child node in the original page is created by the code of the original page. In order not to invade the code of the original page, this embodiment uses the event bubbling mechanism for event delegation, that is, the left-click event and right-click event of the mouse of all child nodes are monitored on the container node.

[0090] Among them, most events on the page will bubble from the current node to the root node after they occur, and all nodes on its path can capture the event. If the event source does not have the ability to handle the event, then it can delegate its parent node to respond to the event, which is event delegation.

[0091] This embodiment monitors the click events of the original page and builds a container node on the code of the original page, thereby ensuring that the page positioning device is ready to use out of the box and has zero intrusion on the code of the original page. It decouples the business code and the positioning function well, and utilizes the front-end event delegation mechanism to implement a custom anchor function for the original page, thereby improving the efficiency of Internet page positioning.

[0092] Optionally, in the method for locating an Internet page provided in an embodiment of the present application, the method further includes: when a user clicks on an anchor creation menu, determining a target character selected by the user; generating a button name for the anchor button based on the target character, creating an anchor button in the scrolling area with the button name displayed in the scrolling area, and linking the anchor button to the target object; after displaying the page content and the anchor button of the target object in the scrolling area constructed for the original page, the method further includes: receiving a destruction instruction from the user for the anchor button, and removing the anchor button from the scrolling area based on the destruction instruction.

[0093] In some examples, such as Fig. 9 As shown, after the anchor creation menu is displayed in the original page, if a user click event on the custom right-click menu, that is, a click event on the anchor creation menu, is detected, the button name displayed by the anchor button can be generated according to the target character selected by the user. In addition, the button name of the anchor button can also be generated not according to the selected target character, and the button name can be customized by the user after the anchor button is generated. If the user determines to create an anchor button for the target object, the target object temporarily stored in the anchor database to be created is used as the link object of the anchor button to create the anchor button.

[0094] Furthermore, the user can also destroy the created anchor button at any time. If the user no longer pays attention to some target objects, the user can right-click the corresponding anchor button, and the device will pop up a confirmation box. After the user confirms, the anchor button will be destroyed. The button is destroyed by monitoring and responding to the right-click event of the anchor button.

[0095] This embodiment supports user-defined anchor points through the page positioning device. During the process of browsing a page, the user can add a new target object at any time and build an anchor button for it for quick positioning when browsing the page later. This embodiment allows the user to define an anchor point according to their own needs, realize quick positioning of any position of the current page, and meet the various personalized needs of users on the Internet.

[0096] Optionally, in the method for locating an Internet page provided in an embodiment of the present application, the method further includes: when a second click event of the user on the scrolling area is detected, or when it is detected that the user's cursor indicates an area other than the scrolling area of ​​the original page, removing the target object from the database of anchor points to be created, and hiding the anchor point creation menu.

[0097] In some examples, the second click event may be a left mouse button event, such as Fig. 9As shown, the target object is the DOM node of the content that the user is concerned about. It is temporarily stored when the first click event of the child node in the original page occurs, and an anchor button is generated when a click event of the anchor creation menu occurs. If the user does not click the anchor creation menu, but other actions occur, such as a left mouse click event or the cursor moves out of the scrolling area, the temporary storage of the target object is canceled and the anchor creation menu is hidden.

[0098] This embodiment monitors the user's second click event and the cursor moving out of the scrolling area, cancels the temporary storage of the target object in time, and hides the anchor creation menu, thereby avoiding the user's accidental touch of an unnecessary anchor button, which affects the user's browsing experience.

[0099] It should be noted that the steps shown in the flowcharts of the accompanying drawings can be executed in a computer system such as a set of computer executable instructions, and that, although a logical order is shown in the flowcharts, in some cases, the steps shown or described can be executed in an order different from that shown here.

[0100] The present application also provides a device for locating an Internet page. It should be noted that the device for locating an Internet page in the present application can be used to execute the method for locating an Internet page provided in the present application. The following is an introduction to the device for locating an Internet page provided in the present application.

[0101] Fig.10 Schematic diagram of a device for locating an Internet page according to an embodiment of the present application. Fig.10 As shown, the positioning device of the Internet page includes:

[0102] Display unit 1001 is used to display page content and an anchor button of a target object in a scrolling area constructed for an original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links the position of the target object in the page content, and the anchor button is pre-created based on an anchor creation instruction performed by a user on the target object in the scrolling area.

[0103] The control unit 1002 is used to control the scrolling area to slide the page when a click instruction on the anchor button is detected, so as to display the target object at a target position in the scrolling area.

[0104] The positioning device of an Internet page provided in an embodiment of the present application displays the page content and the anchor button of the target object in the scrolling area constructed for the original page through the display unit 1001, wherein the scrolling area is used to slide the page content in the original page, and the anchor button links the position of the target object in the page content, and the anchor button is pre-created based on the anchor creation instruction acted by the user on the target object in the scrolling area; the control unit 1002, when detecting a click instruction for the anchor button, controls the scrolling area to slide the page to display the target object at the target position in the scrolling area, thereby achieving the purpose of customizing the anchor point of the Internet page, thereby realizing the effect of improving the user experience of Internet page positioning, and further solving the technical problem in the related art that the page element positioning implemented based on the built-in anchor point of the Internet page cannot effectively meet the user needs.

[0105] Optionally, in the Internet page positioning device provided in the embodiment of the present application, the device also includes: a delegation unit, used to delegate user events of all objects of the original page to the scrolling area through an event bubbling mechanism, wherein the user event is an operation instruction of the user on the object on the original page; a receiving unit, used to receive the user's anchor point creation instruction for the target object in the scrolling area, and create an anchor point button of the target object in the scrolling area through the anchor point creation instruction.

[0106] Optionally, in the positioning device of an Internet page provided in an embodiment of the present application, the control unit 1002 includes: a first determination module, used to determine the coordinates of the scrolling area on the browser, obtain the coordinates of the scrolling area, determine the object coordinates of the target object on the browser, and determine the first coordinate offset of the top of the original page relative to the scrolling area before sliding, wherein, when the scrolling direction of the page is vertical, the coordinates of the scrolling area are the longitudinal coordinates of the scrolling area on the browser, and the object coordinates are the longitudinal coordinates of the target object on the browser; when the scrolling direction of the page is horizontal, the coordinates of the scrolling area are the transverse coordinates of the scrolling area on the browser, and the object coordinates are the transverse coordinates of the target object on the browser; a first calculation module, used to calculate the target coordinate offset of the target object relative to the scrolling area based on the coordinates of the scrolling area, the object coordinates and the first coordinate offset; a control module, used to control the page in the scrolling area to slide according to the target coordinate offset to display the target object at the target position of the scrolling area.

[0107] Optionally, in the positioning device of an Internet page provided in an embodiment of the present application, the first calculation module includes: a first determination submodule, used to determine the first coordinate value of the coordinates of the scrolling area and the second coordinate value of the object coordinates, and calculate the absolute value of the difference between the first coordinate value and the second coordinate value to obtain the coordinate difference; a judgment submodule, used to judge whether the first coordinate value is greater than the second coordinate value; the first calculation submodule, used to calculate the difference between the first coordinate offset and the coordinate difference when the first coordinate value is greater than the second coordinate value, to obtain the target coordinate offset; the second calculation submodule, used to calculate the sum of the first coordinate offset and the coordinate difference when the first coordinate value is less than or equal to the second coordinate value, to obtain the target coordinate offset.

[0108] Optionally, in the Internet page positioning device provided in the embodiment of the present application, the control unit 1002 also includes: a second determination module, used to determine the total length of the original page, calculate the difference between the total length and the target coordinate offset, and obtain the relative distance of the target object relative to the end of the original page, wherein when the scrolling direction of the page is vertical, the total length is the height of the original page on the browser, and when the scrolling direction of the page is horizontal, the total length is the width of the original page on the browser; a judgment module, used to judge whether the first coordinate value of the coordinate of the scrolling area is greater than the relative distance; an execution module, used to execute the step of controlling the page in the scrolling area to slide according to the target coordinate offset when the first coordinate value is less than or equal to the relative distance.

[0109] Optionally, the control unit 1002 also includes: a second calculation module, used to calculate the sum of the first coordinate value and the target coordinate offset when the first coordinate value is greater than the relative distance, and calculate the difference between the sum and the total length to obtain the target length; a setting module, used to set the length of the filling node in the scrolling area as the target length, calculate the sum of the target length and the target coordinate offset, obtain the updated target coordinate offset, and control the page in the scrolling area to slide according to the updated target coordinate offset, wherein the filling node is a node with a preset length as the initial value at the end of the scrolling area, and the filling node is used to fill the gap between the end of the scrolling area and the target object to display the target object at the target position of the scrolling area.

[0110] Optionally, in the Internet page positioning device provided in the embodiment of the present application, the device also includes: a first detection unit, used to determine whether there is a selected character in the scrolling area when a first click event of a user on a target object is detected; a judgment unit, used to determine whether the first click event clicked on the selected character when there is a selected character in the scrolling area; a first creation unit, used to prevent the first click event from bubbling on the original page when the first click event clicked on the selected character, store the target object in a database of anchor points to be created, and display an anchor point creation menu in the scrolling area.

[0111] Optionally, in the Internet page positioning device provided in the embodiment of the present application, the device also includes: a first determination unit, used to determine the target character selected by the user when a click event of the user on the anchor creation menu is detected; a second creation unit, used to generate a button name of the anchor button based on the target character, create an anchor button in the scrolling area with the button name displayed in the scrolling area, and link the anchor button with the target object.

[0112] Optionally, in the Internet page positioning device provided in the embodiment of the present application, the device further includes: a removal unit, configured to receive a user's destruction instruction for the anchor button, and remove the anchor button from the scrolling area based on the destruction instruction.

[0113] Optionally, in the Internet page positioning device provided in the embodiment of the present application, the device also includes: a second detection unit, which is used to remove the target object from the database of anchor points to be created and hide the anchor point creation menu when a second click event of the user on the scrolling area is detected, or when the user's cursor is detected to be in an area other than the scrolling area of ​​the original page.

[0114] The Internet page positioning device provided in the embodiment of the present application may include some or all of the units in the page positioning device provided in the aforementioned embodiment, or include units or modules that implement the same functions as those implemented by some units in the page positioning device provided in the aforementioned embodiment. For example, the control unit 1002 can implement the functions implemented by the anchor point positioning unit 103, the delegation unit can implement the functions implemented by the initialization unit 101, the second creation unit can implement the functions implemented by the anchor point creation unit 102, the removal unit can implement the functions implemented by the anchor point destruction unit 104, and so on.

[0115] It should be understood that the division of the units or modules in the device is only a division of logical functions, and in actual implementation, they can be fully or partially integrated into one physical entity, or they can be physically separated.

[0116] The Internet page positioning device includes a processor and a memory. The display unit 1001 and the control unit 1002 are stored in the memory as program units, and the processor executes the program units stored in the memory to implement corresponding functions.

[0117] The processor includes a kernel, which retrieves the corresponding program unit from the memory. One or more kernels can be set, and the user experience of Internet page positioning can be improved by adjusting kernel parameters.

[0118] The memory may include non-permanent memory in a computer-readable medium, random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM, and the memory includes at least one memory chip.

[0119] An embodiment of the present invention provides a computer-readable storage medium on which a program is stored. When the program is executed by a processor, the method for locating an Internet page provided by any one of the aforementioned embodiments is implemented.

[0120] An embodiment of the present invention provides a processor, and the processor is used to run a program, wherein when the program is run, the method for locating an Internet page provided by any one of the above-mentioned embodiments is executed.

[0121] Fig.11 is a schematic diagram of an electronic device provided according to an embodiment of the present application. Fig.11 As shown, the electronic device 1101 includes a processor, a memory, and a program stored in the memory and executable on the processor. When the processor executes the program, the following steps are implemented: displaying the page content and the anchor button of the target object in the scrolling area constructed for the original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links the position of the target object in the page content, and the anchor button is pre-created based on the anchor creation instruction of the user acting on the target object in the scrolling area; when a click instruction to the anchor button is detected, the scrolling area is controlled to slide the page to display the target object at the target position in the scrolling area. The device in this article can be a server, a PC, a PAD, a mobile phone, etc.

[0122] The present application also provides a computer program product, which, when executed on a data processing device, is suitable for executing a program that is initialized with the following method steps: displaying page content and an anchor button of a target object in a scrolling area constructed for an original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links the position of the target object in the page content, and the anchor button is created in advance based on an anchor creation instruction performed by a user on the target object in the scrolling area; when a click instruction on the anchor button is detected, the scrolling area is controlled to slide the page to display the target object at the target position in the scrolling area.

[0123] Those skilled in the art will appreciate that the embodiments of the present application may be provided as methods, systems, or computer program products. Therefore, the present application may adopt the form of a complete hardware embodiment, a complete software embodiment, or an embodiment in combination with software and hardware. Moreover, the present application may adopt the form of a computer program product implemented in one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) that include computer-usable program code.

[0124] The present application is described with reference to the flowcharts and / or block diagrams of the methods, devices (systems), and computer program products according to the embodiments of the present application. It should be understood that each process and / or box in the flowchart and / or block diagram, as well as the combination of the processes and / or boxes in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing device to generate a machine, so that the instructions executed by the processor of the computer or other programmable data processing device generate instructions for implementing the processes in the flowchart and / or block diagram. Figure 1 A process or multiple processes and / or boxes Figure 1 A device that provides the functions specified in a block or multiple blocks.

[0125] These computer program instructions may also be stored in a computer-readable memory capable of directing a computer or other programmable data processing device to operate in a specific manner, so that the instructions stored in the computer-readable memory produce an article of manufacture comprising an instruction device, which implements the process Figure 1 A process or multiple processes and / or boxes Figure 1 A function specified in one or more boxes.

[0126] These computer program instructions can also be loaded onto a computer or other programmable data processing device so that a series of operating steps are executed on the computer or other programmable device to produce a computer-implemented process, thereby providing instructions for implementing the process in the computer or other programmable device. Figure 1 A process or multiple processes and / or boxes Figure 1 The steps for the functions specified in one or more boxes.

[0127] In a typical configuration, a computing device includes one or more processors (CPU), input / output interfaces, network interfaces, and memory.

[0128] The memory may include non-permanent memory in a computer-readable medium, random access memory (RAM) and / or non-volatile memory in the form of read-only memory (ROM) or flash RAM. The memory is an example of a computer-readable medium.

[0129] Computer readable media include permanent and non-permanent, removable and non-removable media that can be implemented by any method or technology to store information. Information can be computer readable instructions, data structures, program modules or other data. Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technology, compact disk read-only memory (CD-ROM), digital versatile disk (DVD) or other optical storage, magnetic cassettes, magnetic tape disk storage or other magnetic storage devices or any other non-transmission media that can be used to store information that can be accessed by a computing device. As defined herein, computer readable media does not include temporary computer readable media (transitory media), such as modulated data signals and carrier waves.

[0130] It should also be noted that the terms "include", "comprises" or any other variations thereof are intended to cover non-exclusive inclusion, so that a process, method, commodity or device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, commodity or device. In the absence of more restrictions, the elements defined by the sentence "comprises a ..." do not exclude the existence of other identical elements in the process, method, commodity or device including the elements.

[0131] Those skilled in the art will appreciate that the embodiments of the present application may be provided as methods, systems or computer program products. Therefore, the present application may adopt the form of a complete hardware embodiment, a complete software embodiment or an embodiment in combination with software and hardware. Moreover, the present application may adopt the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) that contain computer-usable program code.

[0132] The above are only embodiments of the present application and are not intended to limit the present application. For those skilled in the art, the present application may have various changes and variations. Any modification, equivalent replacement, improvement, etc. made within the spirit and principle of the present application should be included within the scope of the claims of the present application.

Claims

1. A method for locating an Internet page, characterized in that: include: Displaying page content and an anchor button of a target object in a scrolling area constructed for an original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links to the position of the target object in the page content, and the anchor button is created in advance based on an anchor creation instruction applied by a user to the target object in the scrolling area; When a click instruction to the anchor button is detected, the scrolling area is controlled to slide the page so as to display the target object at a target position in the scrolling area.

2. The method according to claim 1, characterized in that The anchor button is created in the following way: Delegating user events of all objects on the original page to the scrolling area through an event bubbling mechanism, wherein the user events are operation instructions of the user on the objects on the original page; An anchor point creation instruction for a target object in the scrolling area is received from a user, and an anchor point button of the target object is created in the scrolling area according to the anchor point creation instruction.

3. The method according to claim 1, characterized in that Controlling the scrolling area to slide the page so as to display the target object at a target position in the scrolling area includes: Determine the coordinates of the scrolling area on the browser, obtain the coordinates of the scrolling area, determine the object coordinates of the target object on the browser, and determine the first coordinate offset of the top of the original page relative to the scrolling area before sliding, wherein, when the scrolling direction of the page is vertical, the coordinates of the scrolling area are the longitudinal coordinates of the scrolling area on the browser, and the object coordinates are the longitudinal coordinates of the target object on the browser; when the scrolling direction of the page is horizontal, the coordinates of the scrolling area are the transverse coordinates of the scrolling area on the browser, and the object coordinates are the transverse coordinates of the target object on the browser; Calculate a target coordinate offset of the target object relative to the scrolling area based on the coordinates of the scrolling area, the object coordinates and the first coordinate offset; The page in the scrolling area is controlled to slide according to the target coordinate offset, so as to display the target object at the target position of the scrolling area.

4. The method according to claim 3, characterized in that Calculating the target coordinate offset of the target object relative to the scrolling area based on the coordinates of the scrolling area, the object coordinates and the first coordinate offset comprises: Determine a first coordinate value of the coordinates of the scrolling area and a second coordinate value of the coordinates of the object, and calculate an absolute value of a difference between the first coordinate value and the second coordinate value to obtain a coordinate difference value; Determining whether the first coordinate value is greater than the second coordinate value; When the first coordinate value is greater than the second coordinate value, calculating the difference between the first coordinate offset and the coordinate difference value to obtain the target coordinate offset; When the first coordinate value is less than or equal to the second coordinate value, the sum of the first coordinate offset and the coordinate difference is calculated to obtain the target coordinate offset.

5. The method according to claim 3, characterized in that: Before controlling the page in the scrolling area to slide according to the target coordinate offset, the method further includes: Determine the total length of the original page, calculate the difference between the total length and the target coordinate offset, and obtain the relative distance of the target object relative to the end of the original page, wherein when the scrolling direction of the page is vertical, the total length is the height of the original page on the browser, and when the scrolling direction of the page is horizontal, the total length is the width of the original page on the browser; Determine whether a first coordinate value of the coordinate of the scrolling area is greater than the relative distance; When the first coordinate value is less than or equal to the relative distance, executing the step of controlling the page in the scrolling area to slide according to the target coordinate offset; When the first coordinate value is greater than the relative distance, the sum of the first coordinate value and the target coordinate offset is calculated, and the difference between the sum and the total length is calculated to obtain the target length; The length of the filling node in the scrolling area is set to the target length, the sum of the target length and the target coordinate offset is calculated to obtain the updated target coordinate offset, and the page in the scrolling area is controlled to slide according to the updated target coordinate offset, wherein the filling node is a node with a length preset at the end of the scrolling area as an initial value, and the filling node is used to fill the gap between the end of the scrolling area and the target object to display the target object at the target position of the scrolling area.

6. The method according to any one of claims 1 to 5, characterized in that: The method further comprises: In case of detecting a first click event of the user on the target object, determining whether there is a selected character in the scrolling area; When the selected character exists in the scrolling area, determining whether the first click event clicks the selected character; In the case that the first click event clicks the selected character, the first click event is prevented from bubbling on the original page, the target object is stored in the database of anchor points to be created, and an anchor point creation menu is displayed in the scrolling area.

7. The method according to claim 6, characterized in that The method further comprises: In case of detecting a click event of the user on the anchor point creation menu, determining the target character selected by the user; Generate a button name of the anchor button based on the target character, create an anchor button in the scrolling area with the button name displayed in the scrolling area, and link the anchor button with the target object; After displaying the page content and the anchor button of the target object in the scrolling area constructed for the original page, the method further includes: A destroy instruction for the anchor button is received from the user, and the anchor button is removed from the scrolling area based on the destroy instruction.

8. The method according to claim 6, characterized in that The method further comprises: When a second click event of the user on the scrolling area is detected, or when it is detected that the user's cursor indicates an area other than the scrolling area of ​​the original page, the target object is removed from the to-be-created anchor database, and the anchor creation menu is hidden.

9. A device for locating an Internet page, characterized in that: include: A display unit, configured to display page content and an anchor button of a target object in a scrolling area constructed for an original page, wherein the scrolling area is used to slide the page content in the original page, the anchor button links to the position of the target object in the page content, and the anchor button is created in advance based on an anchor creation instruction applied by a user to the target object in the scrolling area; The control unit is used to control the scrolling area to slide the page when a click instruction to the anchor button is detected, so as to display the target object at a target position in the scrolling area.

10. An electronic device, characterized in that: It includes one or more processors and a memory, wherein the memory is used to store one or more programs, wherein when the one or more programs are executed by the one or more processors, the one or more processors implement the method for locating an Internet page as described in any one of claims 1 to 8.

Citation Information

Cited By

  • Method for realizing sliding viewing of long list based on pressing mode

    CN119356588A