Method for text searching of web page and related product thereof
By using the document object model tree to divide the search unit on the browser side to search keywords, the problem of being unable to accurately search cross-label keywords in the prior art is solved, and the accurate highlighting of keywords in the web page and semantic search results are achieved.
Patent Information
- Application Number
- CN202210343759.4
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-03-31
- Publication Date
- 2025-08-05
- Estimated Expiration
- 2042-03-31
AI Technical Summary
The prior art does not have the effect of searching web keywords on the browser side, and it is impossible to search multiple keywords at the same time and cannot highlight keywords across tags, resulting in inaccurate search results.
By obtaining the document object model tree of the web page, it is divided into a semantic complete search unit, and the search unit is determined by traversing the text nodes and the document object model tree, keyword search processing and highlighting are performed to ensure that the search results are in line with semantics.
It realizes accurate search of keywords in web pages on the browser side, supports cross-label keyword content display, and improves the accuracy and consistency of search results.
Smart Images

Figure CN114741578B_ABST
Abstract
Description
Technical Field
[0001] Embodiments of the present invention relate to the field of Internet technology, and more specifically, to a method for performing text search on a web page, a device for executing the aforementioned method, and a computer-readable storage medium. Background Art
[0002] This section is intended to provide background or context for embodiments of the present invention as recited in the claims. The description herein may include concepts that could be explored, but not necessarily concepts that have been previously conceived or explored. Therefore, unless otherwise indicated herein, the material described in this section is not prior art with respect to the specification and claims of this application and is not admitted to be prior art by inclusion in this section.
[0003] In order to help users quickly find content on web pages, websites generally provide a search function and highlight the search keywords. The keyword search process can be processed by the server and generate a good Hypertext Markup Language (HTML) to be transmitted to the browser to display the search results and highlight the keywords.
[0004] However, in some scenarios, the server may not be able to provide search functionality or generate HTML that highlights search results keywords. Alternatively, the server may only provide search functionality and keywords and provide matching raw HTML content, but not generate HTML that highlights search results keywords. Therefore, it is generally necessary to implement search functionality or match search results keywords and highlight them on the browser side.
[0005] When searching for content in a web page and highlighting keywords on the browser side, you can use the window.find() API supported by most browsers to achieve this. The window.find() API is provided by the browser, and its functions cannot be expanded. It does not support searching for multiple keywords at the same time, and it cannot highlight multiple keyword search results at the same time. In addition, the HTML content to be searched can also be processed through a JavaScript program. Specifically, the HTML to be searched can be subjected to text replacement processing, but this implementation method has the disadvantage of not being able to handle some scenarios. For example, when the tag of the HTML string contains keywords, it is easy to cause the processed HTML string to be not legal HTML, and redundant text is presented after rendering. For another example, when the content of the keyword may be distributed in different tags (that is, the keyword crosses tags), the processed HTML string will omit some keywords and there will be no corresponding highlighting, and it will not support cross-tag keyword search. It can be seen that the existing keyword search effect is not ideal and cannot meet actual needs. Summary of the Invention
[0006] Searching for keywords in web pages is known to be suboptimal and inaccurate, which can be a very frustrating process.
[0007] Therefore, there is a great need for an improved method for performing text search on web pages and related products thereof, which can perform keyword search processing based on search units about text content in web pages, thereby achieving accurate search of keywords in web pages on the browser side.
[0008] In this context, embodiments of the present invention are intended to provide a method for performing text search on web pages and related products.
[0009] In a first aspect of an embodiment of the present invention, a method for performing text search on a web page is provided, comprising: obtaining one or more search units regarding text content in a web page; in response to a search demand for text content in the web page, performing keyword search processing on the search units in units of the search units to obtain keyword search results regarding the text content in the web page; and displaying the keyword search results on the web page.
[0010] In one embodiment of the present invention, obtaining one or more search units about text content in a web page includes: traversing the document object model tree of the HTML document of the web page to obtain text nodes; and determining the search units according to the text nodes.
[0011] In another embodiment of the present invention, traversing the document object model tree of the HTML document of the web page includes: extracting from the document object model tree text nodes that have the same nearest ancestor block-level element, the same block-level depth, and consecutive adjacent text nodes, wherein the block-level depth of the text node refers to the number of block-level elements passed from the root node of the document object model tree to the text node; and / or extracting from the document object model tree text nodes that are alone under a block-level element and have no adjacent nodes.
[0012] In yet another embodiment of the present invention, performing keyword search processing on the search unit includes: performing one or more keyword search processes on text content corresponding to text nodes in the search unit.
[0013] In another embodiment of the present invention, for each keyword, keyword search processing includes: obtaining a search result of the keyword using a text-to-node mapping algorithm from the starting position of the keyword in the text content of the search unit, and continuing to determine the next search result using the text-to-node mapping algorithm from the ending position of the search result in the text content of the search unit until the search unit is searched, wherein each of the search results includes the keyword and the position information of the keyword in the document object model tree.
[0014] In one embodiment of the present invention, the position information of the keyword in the document object model tree includes the starting position and ending position of the keyword in the text content of the search unit, the starting text node and ending text node matched by the keyword, the starting position in the text content of the starting text node, and the ending position in the text content of the ending text node, wherein obtaining a search result for the keyword using a text-to-node mapping algorithm includes: determining the ending position of the keyword in the text content of the search unit using the starting position of the keyword in the text content of the search unit and the length of the keyword; determining the starting text node matched by the keyword and the starting position in the text content of the starting text node using the text nodes in the search unit and the starting position of the keyword in the text content of the search unit; and determining the ending text node matched by the keyword and the ending position in the text content of the ending text node using the text nodes in the search unit and the ending position of the keyword in the text content of the search unit.
[0015] In another embodiment of the present invention, displaying the keyword search results on the webpage includes: highlighting one or more keywords on the webpage using the keyword search results.
[0016] In another embodiment of the present invention, highlighting one or more keywords in the web page using the search results of the keywords includes: sorting the search results of the keywords; and traversing the sorted search results, and performing corresponding highlighting processing according to the relationship between the search results to be processed and the range of processed search results.
[0017] In another embodiment of the present invention, sorting the keyword search results includes: arranging the results in descending order according to the size of the end position of each keyword in the search results in the text content of the search unit.
[0018] In one embodiment of the present invention, corresponding highlight display processing is performed in sequence according to the relationship between the search results to be processed and the range of processed search results, including: in response to the search results to be processed having no intersection with the range of processed search results, directly performing a corresponding display operation based on the comparison result between the start text node and the end text node matched by the keyword in the search results to be processed; in response to the search results to be processed having an intersection with the range of processed search results and satisfying a first preset relationship, directly performing processing on the next search result to be processed; in response to the search results to be processed having an intersection with the range of processed search results and satisfying a second preset relationship, recalculating the position information of the keyword in the search results to be processed in the document object model tree, and performing a corresponding display operation based on the recalculated comparison result between the start text node and the end text node matched by the keyword in the search results to be processed.
[0019] In another embodiment of the present invention, performing the corresponding display operation includes: in response to the start text node and the end text node matched by the keyword in the pending search result being the same, modifying the style of the parent node of the start text node matched by the keyword in the pending search result;
[0020] In response to the start text node and the end text node matched by the keyword in the pending search result being different, the text content of the matched portion is determined and replaced with a styled document object model tree element.
[0021] In another embodiment of the present invention, the method further includes: calculating the position information of the specified search result in response to a display demand for the specified search result; and controlling the webpage to scroll to the position of the specified search result using the position information of the specified search result.
[0022] In a second aspect of an embodiment of the present invention, a device is provided, comprising: a processor; and a memory storing computer instructions for performing text searches on web pages, wherein when the computer instructions are executed by the processor, the device executes the method described in the foregoing and following embodiments.
[0023] In a third aspect of the present invention, a computer-readable storage medium is provided, comprising program instructions for performing text search on web pages. When the program instructions are executed by a processor, the device executes the method according to the above and following embodiments.
[0024] According to the method for performing text search on a web page and its related products according to the embodiment of the present invention, the search unit related to the text content in the web page can be used as a unit to perform keyword search processing on the search unit and display the keyword search results, thereby realizing accurate search of keywords in the web page on the browser side. At the same time, the entire search processing process is searched in units of search units, and is not limited to the number and position of keywords (for example, whether it crosses tags), so that while ensuring that the keyword search results are semantically consistent, it can support keyword content across tags. In some embodiments of the present invention, unlike the existing simple text replacement processing of HTML content, the keyword search processing is performed by analyzing and processing the document object model tree of the HTML document of the web page. For example, the search unit can be determined by using the text node obtained by traversing the document object model tree. For another example, one or more keyword search processes can also be performed based on the search unit. For another example, the position information of the keyword in the document object model tree can be used to describe the search results, etc.
[0025] In other embodiments of the present invention, one or more keywords may be highlighted using keyword search results to meet the need to highlight multiple keywords at the same time.
[0026] In addition, in some further embodiments of the present invention, the webpage can be controlled to scroll to a specified search result location to meet the demand for displaying the search results at the specified location. BRIEF DESCRIPTION OF THE DRAWINGS
[0027] The above and other objects, features and advantages of the exemplary embodiments of the present invention will become readily apparent by reading the following detailed description with reference to the accompanying drawings, in which several embodiments of the present invention are shown by way of example and not limitation, in which:
[0028] Figure 1 A block diagram schematically illustrates an exemplary computing system 100 suitable for implementing embodiments of the present invention;
[0029] Figure 2 The following schematically shows a flow chart of a method for performing text search on a web page according to one embodiment of the present invention;
[0030] Figure 3 Schematically shows a schematic diagram of traversing a document object model tree according to an embodiment of the present invention;
[0031] Figure 4 Schematically shows a flow chart of a method for performing text search on a web page according to another embodiment of the present invention;
[0032] Figure 5 Schematically shows a flow chart of a method for obtaining a search unit according to an embodiment of the present invention;
[0033] Figure 6 Schematically shows a flow chart of a method for performing keyword search processing on a search unit according to the present invention;
[0034] Figure 7 A flowchart of a method for highlighting keywords based on search results according to the present invention is schematically shown; and
[0035] Figure 8 A schematic block diagram of a device according to an embodiment of the present invention is schematically shown.
[0036] In the drawings, the same or corresponding reference numerals denote the same or corresponding parts. DETAILED DESCRIPTION
[0037] The principles and spirit of the present invention will be described below with reference to several exemplary embodiments. It should be understood that these embodiments are provided solely to enable those skilled in the art to better understand and implement the present invention, and are not intended to limit the scope of the present invention in any way. Rather, these embodiments are provided to make this disclosure more thorough and complete, and to fully convey the scope of the present disclosure to those skilled in the art.
[0038] Figure 1 1 shows a block diagram of an exemplary computing system 100 suitable for implementing embodiments of the present invention. Figure 1As shown, the computing system 100 may include a central processing unit (CPU) 101, a random access memory (RAM) 102, a read-only memory (ROM) 103, a system bus 104, a hard disk controller 105, a keyboard controller 106, a serial interface controller 107, a parallel interface controller 108, a display controller 109, a hard disk 110, a keyboard 111, a serial peripheral device 112, a parallel peripheral device 113, and a display 114. Of these devices, the CPU 101, RAM 102, ROM 103, hard disk controller 105, keyboard controller 106, serial controller 107, parallel controller 108, and display controller 109 are coupled to the system bus 104. The hard disk 110 is coupled to the hard disk controller 105, the keyboard 111 is coupled to the keyboard controller 106, the serial peripheral device 112 is coupled to the serial interface controller 107, the parallel peripheral device 113 is coupled to the parallel interface controller 108, and the display 114 is coupled to the display controller 109. It should be understood that Figure 1 The structured block diagram is only for the purpose of illustration, rather than for limiting the scope of the present invention. In some cases, some devices may be added or reduced according to specific circumstances.
[0039] Those skilled in the art will appreciate that embodiments of the present invention may be implemented as a system, method, or computer program product. Therefore, the present disclosure may be implemented in the following forms: entirely in hardware, entirely in software (including firmware, resident software, microcode, etc.), or in a combination of hardware and software, generally referred to herein as a "circuit," "module," "unit," or "system." Furthermore, in some embodiments, the present invention may also be implemented in the form of a computer program product in one or more computer-readable media containing computer-readable program code.
[0040] Any combination of one or more computer-readable media can be used. A computer-readable medium can be a computer-readable signal medium or a computer-readable storage medium. A computer-readable storage medium can be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or component, or any combination thereof. More specific examples (non-exhaustive examples) of computer-readable storage media can include, for example: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination thereof. In this document, a computer-readable storage medium can be any tangible medium containing or storing a program that can be used by or in combination with an instruction execution system, device or device.
[0041] A computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave, which carries computer-readable program code. Such propagated data signals may take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. A computer-readable signal medium may also be any computer-readable medium other than a computer-readable storage medium that can transmit, propagate, or transport a program for use by or in conjunction with an instruction execution system, apparatus, or device.
[0042] Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to wireless, wireline, optical fiber cable, RF, etc., or any suitable combination of the foregoing.
[0043] The computer program code for performing the operations of the present invention can be written in one or more programming languages, or a combination thereof, including object-oriented programming languages such as Java, Smalltalk, C++, and conventional procedural programming languages such as "C" or similar programming languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a stand-alone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving a remote computer, the remote computer can be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or can be connected to an external computer (e.g., through the Internet using an Internet service provider).
[0044] The following will describe the embodiments of the present invention with reference to the flowcharts of the methods and block diagrams of the devices (or systems) according to the embodiments of the present invention. It should be understood that each block in the flowcharts and / or block diagrams, as well as the combination of blocks in the flowcharts and / or block diagrams, 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, or other programmable data processing device to produce a machine, and these computer program instructions are executed by the computer or other programmable data processing device to produce a device that implements the functions / operations specified in the blocks in the flowcharts and / or block diagrams.
[0045] These computer program instructions can also be stored in a computer-readable medium that enables a computer or other programmable data processing device to operate in a specific manner. In this way, the instructions stored in the computer-readable medium produce a product that includes an instruction device that implements the functions / operations specified in the blocks in the flowchart and / or block diagram.
[0046] Computer program instructions may also be loaded onto a computer, other programmable data processing apparatus, or other device so that a series of operational steps are performed on the computer, other programmable data processing apparatus, or other device to produce a computer-implemented process, such that the instructions executed on the computer or other programmable apparatus provide a process that implements the functions / operations specified in the blocks in the flowchart and / or block diagram.
[0047] According to an embodiment of the present invention, a method for performing text search on a web page and related products are proposed.
[0048] In addition, any number of elements in the drawings is for illustration and not limitation, and any naming is for distinction only and does not have any limiting meaning.
[0049] The principles and spirit of the present invention are explained in detail below with reference to several representative embodiments of the present invention. SUMMARY OF THE INVENTION
[0051] The inventors have found that the related technology is not ideal in the search processing of keywords in web pages. Specifically, for example, it can be implemented using the window.find() API supported by most browsers. However, this window.find() is provided by the browser, and its functions cannot be expanded. It also has disadvantages such as not being able to search for multiple keywords at the same time, not being able to highlight multiple keyword search processing results at the same time, and only being able to search the entire web page as a whole without being able to specify a specific area. For another example, a JavaScript program can be used to process the HTML content to be searched, which can perform text replacement processing on the HTML to be searched. However, there are some scenarios that this method cannot handle:
[0052] 1. Scenarios where keywords may exist in tags in HTML strings
[0053] For example, if the HTML string is " <p data-text="阳光很好"> It’s sunny today, with a gentle breeze, and the sunshine is particularly comfortable. ". The label The attribute contains the keyword "sunshine". If you use the text replacement method to search for the keywords "sunshine" and "breeze", you can get the following HTML string: <p data-text="<markstyle="background-color:yellow;"> Today <mark style="background-color:yellow;"> Sunlight< / mark> Bright, <mark style="background-color:yellow;"> breeze< / mark> Slightly brush, <mark style="background-color:yellow;"> Sunlight< / mark> It feels so comfortable to bask in the sun. ".
[0054] Finally, it is rendered in the browser as "The sun is shining">Today the sun is shining brightly, the breeze is blowing gently, and the sun is particularly comfortable." It can be clearly seen that the processed HTML string is not legal HTML, and the redundant text "The sun is shining">" is presented after rendering.
[0055] 2. Scenarios where the keyword content may be distributed across different tags (i.e., keywords span tags)
[0056] For example, if the HTML string is " today <em> Positive< / em> The sun is bright, the breeze is gentle, and the sunshine is particularly comfortable. ”, which uses <em>The label wraps the character "Yang". If the text replacement processing method is used to search for keywords "sunshine" and "gentle breeze", the following HTML string can be obtained: " today <em> Positive< / em> Bright and beautiful, <mark style="background-color:yellow;"> breeze< / mark> Slightly brush, <mark style="background-color:yellow;"> Sunlight< / mark> It feels so comfortable to bask in the sun. ".
[0057] Finally, it is rendered in the browser as "Today is sunny, with a gentle breeze, and the sun shines very comfortably". It can be seen that the first "sunshine" is ignored and not highlighted. Even using the well-known open-source software package mark.js cannot solve this problem.
[0058] Based on this, the inventor found that a search unit related to the semantic content of the text on the web page can be used to implement keyword search processing. The text content of the web page can be divided into several search units, and each search unit contains a text content with complete semantics. Thus, through the aid of this search unit, accurate search for keywords in the web page can be achieved on the browser side.
[0059] After introducing the basic principle of the present invention, various non-limiting embodiments of the present invention will be specifically introduced below.
[0060] Exemplary Methods
[0061] Below, reference is made to Figure 2 to describe a method for text search of a web page according to an exemplary embodiment of the present invention. It should be noted that the embodiments of the present invention can be applied to any applicable scenario.
[0062] Figure 2 Schematically shows a flowchart of a method 200 for text search of a web page according to an embodiment of the present invention. As Figure 2 shown, at step S201, one or more search units regarding the text content on the web page can be obtained. It can be understood that in the present invention, a piece of content with complete semantics on the web page can be called a search unit. Thus, even keywords located in different tags can be divided into one search unit according to semantic integrity. In some embodiments, the text content on the web page can be divided into one or more search units according to semantic integrity, so as to implement semantic-compliant keyword search for the web page text content by means of the search unit. It should be noted that the detailed description of dividing the search unit here is only an exemplary illustration, and the solution of the present invention is not limited by this.
[0063] Then, at step S202, in response to the search demand for the text content in the web page, the search unit can be subjected to keyword search processing with the aforementioned search unit as a unit to obtain keyword search results about the text content in the web page. It should be noted that the aforementioned search demand can be understood as a search for one or more keywords, for example, it can be determined based on the search content input by the user manually, by voice or in other ways. The detailed description of the search demand here is only an exemplary description, and the solution of the present invention is not limited thereto, and can be specifically adjusted according to the interactive design of the web page. In addition, keyword search processing of the search unit with the search unit as a unit can achieve an accurate and semantically comprehensive search of the text content in the web page.
[0064] Then, at step S203, the aforementioned keyword search results can be displayed on the web page. Thus, the search units related to the text content in the web page can be used as units to perform keyword search processing on the search units and display the keyword search results, thereby achieving accurate search of keywords in the web page on the browser side. At the same time, the entire search processing process is searched in units of search units, and is not limited to the number and position of keywords (for example, whether they cross tags), so that while ensuring that the keyword search results are semantically consistent, it can support keyword content across tags.
[0065] In some embodiments, one or more keyword searches can be performed within a search unit, and the searched keywords can be highlighted. During the search process, the search unit is usually used as a unit, and the contents of multiple search units are not merged for search. For example, there is the following HTML: Today is sunny and the breeze is blowing. It is a rare good day. I spent half a day in the park If the entire "div" is used as a unit and the keyword "sunshine" is searched, the "yang" in "It's a rare good sun" and the "guang" in "Guangzai Park stayed for half a day" may be spliced together, resulting in a match for "sunshine". If each "p" tag is used as a search unit, the search results will be more semantically consistent. Therefore, in order to perform a semantic search on a section of web page content, it is necessary to first divide the section of web page content into several search units.
[0066] In some embodiments, the document object model tree of the HTML document can be used to determine the search unit. Specifically, the document object model tree of the HTML document of the web page can be traversed to obtain text nodes. Then, the search unit is determined based on the aforementioned text nodes. The aforementioned acquisition of the text nodes can specifically involve extracting text nodes with the same nearest ancestor block-level element, the same block-level depth, and continuous adjacent text nodes from the document object model tree, or extracting text nodes that are alone under a block-level element and have no adjacent nodes from the document object model tree.
[0067] In some embodiments, the aforementioned document object model tree includes a DOM tree, and DOM nodes can be obtained by parsing the HTML document of the web page (for example, using a browser to parse), and the DOM nodes are also called DOM trees. The DOM tree can include multiple types of nodes, such as element nodes (Element Node), text nodes (Text Node), comment nodes (Comment Node) and document nodes (Document Node). Among them, element nodes can generally be divided into block-level elements and inline elements. Specifically, in the process of traversing the DOM tree, it can be determined whether the element node associated with the text node in the DOM tree is a block-level element or an inline element based on the element's tag name (tagName) and display style attribute information (such as the attribute value of the cascading style sheet CSS or other attribute values that affect the display effect of the element).
[0068] The block depth of a text node can be understood as the number of block-level elements passed through from the root node of the DOM tree to the text node. The ancestor block-level elements can be understood as all block-level elements that the node has passed through. The consecutive adjacent text nodes can be understood as text nodes directly associated with the same nearest ancestor block-level element and text nodes indirectly associated with the same nearest ancestor block-level element via inline elements.
[0069] It should be noted that a text node does not necessarily have text content or the text content is an empty string, so a text node with text content is a valid text node, and a valid text node can also be called a searchable node. In some embodiments, a group of search nodes that meet the following conditions at the same time can be abstracted as a search unit: 1. The nearest ancestor block-level element is the same; 2. The block-level depth is equal; 3. After ignoring inline elements, they can be regarded as continuous and adjacent in the DOM tree structure. It should be noted that if there is only one search node in the group of search nodes, it can also be regarded as meeting the requirements; if there are multiple search nodes in the group of search nodes, they must be continuous and adjacent to be considered as meeting the requirements. The following is combined with Figure 3 Further explanation of the above content.
[0070] Figure 3 It is a DOM tree parsed from a piece of HTML code document. Figure 3 The solid lines in the figure represent direct node relationships, and the dotted lines represent node relationships after ignoring inline elements; "div", "h1", "p" and "h3" represent block-level elements, and "div" represents the root node; "span" and "em" represent inline elements; text in the figure such as "diary", "weather", "today", ..., "watt" represent text nodes (also called search nodes).
[0071] like Figure 3 As shown, "Diary" is alone under the block-level element "h1" and has no adjacent nodes, so it can be abstracted as a single search unit. "Diary" cannot be abstracted into a single search unit with the subsequent text nodes "Weather" and "Nice" because "Diary" is under the block-level element "h1," while "Weather" and "Nice" are under the block-level element "p," and their nearest ancestor block-level elements are different. However, "Weather" and "Nice" are both under the block-level element "p," have the same block-level depth (both 2), and are adjacent, so they can be abstracted into a single search unit.
[0072] "Today," "I," "I went," "trip," and "Forbidden City" are all under the block-level element "div," have the same block-level depth (all 1), and are contiguous and adjacent, making them suitable for abstraction as a single search unit. However, these text nodes cannot be combined with the subsequent text nodes "red," "wall," "yellow," and "tile" to form a single search unit, because "Forbidden City" and "red" are separated by the block-level element "h3," and therefore are not adjacent.
[0073] Furthermore, "The Forbidden City is beautiful" is located alone within the block-level element "h3" and has no adjacent nodes, so it can be abstracted as a single search unit. Meanwhile, "red," "wall," "yellow," and "tile" are all within the block-level element "div," have the same block-level depth (all 1), and are contiguous and adjacent, so they can also be abstracted as a single search unit.
[0074] Figure 4 The flowchart of a method 400 for performing text search on a web page according to another embodiment of the present invention is schematically shown. It can be understood that Figure 4 It can be combined with the previous text Figure 2 An exemplary implementation of each step described. Figure 2 and Figure 3 The detailed description of each step in the above also applies to the following.
[0075] like Figure 4 As shown, at step S401, the web page content can be divided into several search units. In order to facilitate understanding of the present invention, the following data structure will be used to describe the search node and search unit. Specifically, the search node can be described by the text node node and the block depth blockDepth of the text node. Among them, node is a text node type and blockDepth is an integer type. The search unit (Translation Unit) can be described by the following structure:
[0076] 1. nodes: represents the array type. Each item in the array is a text node (i.e., a search node). A search unit contains all text nodes in the array.
[0077] 2. textFromNodes: represents a string type, representing the text content generated by the array nodes. Specifically, each text node under the array nodes can be traversed to obtain the text content of the node, and then the textContent of each node can be appended to textFromNodes one by one. In some embodiments, when obtaining the text content of a text node, the textContent attribute, the nodeValue attribute, or other attributes or methods that can obtain the content of a text node can be used, and this is not limited here.
[0078] 3. searchResultList: represents an array type that contains the search results returned by searching for one or more keywords. Each item in the array is a search result (SearchResult), which has the following content:
[0079] i.keyword: text type, indicating a search keyword. It should be noted that, in the present invention, a keyword specifically refers to a continuous non-blank character. For example, "sunshine", "gentle breeze", etc. can each be used as a keyword. For another example, "sunshine and gentle breeze" cannot be used as a keyword because there is a blank character between "sunshine" and "gentle breeze". For another example, "sunshine and gentle breeze" can only be used as one keyword, not two keywords, because "sunshine" and "gentle breeze" are continuous.
[0080] ii.startIndexInText: indicates the starting position of the search keyword in textFromNodes.
[0081] iii.endIndexInText: indicates the end position of the search keyword in textFromNodes.
[0082] iv.startNode: Indicates the text node where the search keyword matches.
[0083] v.startIndex: indicates the starting position of the search keyword in the text content of startNode.
[0084] vi.endNode: Indicates the end text node of the search keyword match.
[0085] vii.endIndex: indicates the end position of the search keyword in the text content of endNode.
[0086] There are many ways to divide the search unit. Figure 5 FIG. 1 shows a feasible way to obtain a search unit. Figure 5 As shown, in actual application, at step S501, an empty array SearchableUnitList can be created. The SearchableUnitList can be used to store search units extracted from a web page. Then, the root node of the DOM node specified in the web page can be determined, and the type of the root node can be determined.
[0087] Then, at step S502, if it is determined that the root node is a block-level element (its block-level depth is 1), its child nodes can be traversed. Specifically, it can involve calculating its own block-level depth (specifically, it can be +1 based on the block-level depth of the parent node), creating a searchableNodeList for storing data of the search node, and traversing the child nodes. In some embodiments, if the child node is a block-level element, the searchableNodeList can be scanned from left to right. If the searchableNodeList is empty, it means that there are no search nodes to be processed, and step S502 can be repeated. If the searchableNodeList is not empty, it means that there are search nodes to be processed. At this time, adjacent search nodes with equal block-level depth can be created into a search unit (specifically, only the nodes and textFromNodes of the search unit need to be assigned), and then the created search unit is pushed to the array searchableUnitList (wherein several search units can be created using the searchableNodeList). Then, the processed search node is removed from the searchableNodeList, and the aforementioned operation is repeated until all search nodes in the searchableNodeList are processed (at this time, the searchableNodeList is empty). Finally, return to execute step S502.
[0088] In some embodiments, if the child node of the block-level element is an inline element, step S503 may be executed; if the child node of the block-level element is another type of node (such as a comment node, etc.) or has no child node, no processing may be performed.
[0089] Then, at step S503, if it is determined that the element itself is an inline element (its block-level depth is 0), its child nodes can be traversed. Specifically, it can involve calculating its own block-level depth (which is the block-level depth of the parent node), traversing the child nodes, and processing each child node. In some embodiments, if the child node of the inline element is a block-level element, step S502 can be executed; if the child node is an inline element, step S503 is still executed; if the child node is a text node, step S504 can be executed; if the child node is a node of other types or has no child nodes, no processing can be performed.
[0090] Then, at step S504, if it is determined that the node itself is a text node, a search node can be created based on the text node. In some embodiments, if the search node is created successfully, the search node can be pushed into the searchableNodeList created in the nearest ancestor block-level element. If the text node itself has no content or the content is empty characters, etc., a search node cannot be created and no processing is required at this time. If the child node is a node of other types or has no child nodes, no processing is required. It should be noted that the description of the acquisition process of the search unit here is only an exemplary description, and the solution of the present invention is not limited to this.
[0091] After obtaining the search unit, return Figure 4 Next, at step S402, a search process may be performed on a number of keywords in the search unit extracted in the previous step.
[0092] There are many ways to process keyword searches. Figure 6 This is a feasible way to perform keyword search processing on the search unit. The keyword to be searched can be only one or more, and each keyword can be Figure 6 Perform search processing. Figure 6 As shown, at step S601, if there are items in the array searchableUnitList storing searchable units, the keyword keyword can be searched for each item searchableUnitList in turn. If there are no items in the array searchableUnitList storing searchable units, the keyword keyword search process is terminated.
[0093] Then, at step S602, it can be determined whether the keyword keyword is found. Specifically, the keyword keyword can be searched using textFromNodes in each searchableUnit. For example, the String.prototype.indexOf API can be used to search: let theIndex=textFromNodes.indexOf(keyword,0). If it can (for example, theIndex>-1), step S603 can be executed. If it cannot (for example, theIndex=-1), step S608 is executed, and the search for the keyword keyword can be ended directly. It should be noted that the detailed description of the keyword search method here is illustrative, and the solution of the present invention is not limited to this.
[0094] Next, at step S603, the starting position information startIndexInText of the keyword keyword in textFromNodes can be obtained, and at step S604, the ending position information endIndexInText of the keyword in textFromNodes can be obtained. In some embodiments, the ending position information endIndexInText can be calculated based on the starting position information startIndexInText and the length of keyword. For example, endIndexInText = startIndexInText + keyword.length. It should be noted that the description of the process of obtaining the ending position information here is only an example.
[0095] Next, at step S605, a search result, searchResult, may be created based on startIndexInText and endIndexInText. Each search result may include a keyword and information about the keyword's location in the document object model tree. In some embodiments, a text-to-node mapping algorithm may be used to obtain a search result for the keyword from the starting position of the keyword in the text content of the search unit, and the aforementioned text-to-node mapping algorithm may be used to determine the next search result from the ending position of the search result in the text content of the search unit until the search unit is exhausted.
[0096] It should be noted that in the present invention, the method of calculating startNode, startIndex, endNode, and endIndex based on startIndexInText, nodes, and endIndexInText is called text-to-node mapping calculation. Specifically, startNode and startIndex can be calculated based on startIndexInText and nodes. For example, the text nodes in the array nodes can be traversed starting from 0, and the sum of the lengths of the text contents of the text nodes, sum, can be calculated (wherein the initial value of sum can be 0). Then, when traversing to the i-th text node nodes[i], sum=L0+L1+L2+...+Li-1 (wherein L0 / L1 / L2 / Li-1 represent the text content lengths of the 0th / 1st / 2nd / i-1th text nodes, respectively). At this point, if startIndexInText≥sum and startIndexInText≤sum+Li, it can be determined that startNode is the i-th text node node[i], and startIndex=startIndexInText–sum.
[0097] You can also calculate endNode and endIndex based on endIndexInText and nodes. For example, you can start traversing the text nodes in the array nodes from 0 and calculate the sum of the lengths of the text contents of the text nodes (sum can be the initial value of 0). Then, when traversing to the i-th text node nodes[i], sum = L0+L1+L2+...+Li-1 (where L0 / L1 / L2 / Li-1 represent the text content lengths of the 0th / 1st / 2nd / i-1th text nodes, respectively). At this time, if endIndexInText≥sum and endIndexInText≤sum+Li, you can determine that endNode is the i-th text node node[i], and endIndex = endIndexInText–sum. The startNode, startIndex, endNode, and endIndex calculated above are added to keyword, startIndexInText, and endIndexInText to create the search result searchResult.
[0098] Next, at step S606, the search result searchResult can be pushed into the searchResultList array of the searchableUnit. Then, at step S607, the search for keyword can be continued starting from the endIndexInText position of textFromNodes. For example, theIndex = textFromNodes.indexOf(keyword, endIndexInText). If the result is not found (for example, theIndex > -1), steps S603 to S607 can be repeated. If the result is not found (for example, theIndex = -1), step S608 is executed.
[0099] The following is a specific example of Figure 6 The individual steps described are further explained:
[0100] Suppose there is a piece of HTML: today <em style="font-size:2em"> Positive< / em> The sun is shining, the breeze is blowing, and the sun is so comfortable Then its searchableUnit includes: nodes: containing the text nodes "today", "sun", "the sun is bright, the breeze is blowing, and the sun is particularly comfortable"; textFromNodes: the value is the string "today the sun is bright, the breeze is blowing, and the sun is particularly comfortable".
[0101] Assume the search keyword is "sunshine". The process for this keyword includes: searching for "sunshine" starting from the position where the last search for "sunshine" ended on textFromNodes (at this time, there is no end position, i.e., 0). For example, let theIndex = textFromNodes.indexOf("sunshine", 0). At this time, the value calculated for theIndex is 2, which is the position of "阳" in "今天阳光明媚..." (positions start from 0). Then, the value of theIndex can be assigned to startIndexInText (at this time, the value of startIndexInText is 2), and the value of endIndexInText can be calculated. For example, endIndexInText = startIndexInText + "sunshine".length, then the value of endIndexInText is 4.
[0102] Next, startNode and startIndex can be calculated based on nodes and startIndexInText (with a value of 2). Specifically, when i equals 1, the sum value is 2 (sum = L0, where L0 is the string length of "今天"), and it satisfies the condition startIndexInText ≥ sum. And the value of sum + L1 is 3 (3 = sum + L1 = 2 + 1, where L1 is the string length of "阳"), and it satisfies the condition startIndexInText < sum + Li. Therefore, startNode is the text node "阳", and startIndex is 0 (0 = startIndexInText - sum = 2 - 2).
[0103] Next, endNode and endIndex can be calculated based on nodes and endIndexInText (with a value of 4). Specifically, when i = 2, the sum value is 3 (sum = L0 + L1, where L0 is the string length of "今天" and L1 is the string length of "阳"), and it satisfies the condition endIndexInText ≥ sum. And the value of sum + L2 is 20 (20 = sum + L2 = 3 + 17, where L2 is the string length of "光明媚,清风微拂,阳光晒得特别舒服"), and it satisfies the condition endIndexInText < sum + Li. Therefore, endNode is the text node "光明媚,清风微拂,阳光晒得特别舒服", and startIndex is 1 (1 = endIndexInText - sum = 4 - 3).
[0104] Next, a search result can be created based on the calculated startNode, startIndex, endNode, and endIndex and pushed into the searchResultList array. Then, continue to search for "阳光" starting from the end position of the previous search for "阳光", that is, at endIndexInText (with a value of 4). Among them, theIndex = textFromNodes.indexOf("阳光", endIndexInText). At this time, theIndex is 12, and startIndexInText can be calculated as 12, endIndexInText as 14, startNode as the text node "阳光晒得特别舒服", startIndex value as 9, endNode as the text node "阳光晒得特别舒服", and endIndex value as 11. Continue to create a search result based on the calculated startNode, startIndex, endNode, and endIndex and push it into the searchResultList array. And start searching for "阳光" from the end position of the previous search for "阳光" (that is, the value of endIndexInText is 14). Among them, theIndex = textFromNodes.indexOf("阳光", endIndexInText). At this time, theIndex is -1, indicating that it is not found, and the search for "阳光" ends.
[0105] After completing the search processing of the keyword, return Figure 4 . Next, at step S403, the keyword can be highlighted based on the search result so that the user can visually see the search result keyword. There are various ways to display the search result on the web page. Figure 7 Fig. shows a feasible way to highlight the keyword according to the search result.
[0106] Specifically, each item searchableUnit in the searchableUnitList can be traversed for Figure 7 the processing process shown. As Figure 7 As shown, at step S701, the nodes and searchResultList under searchableUnit can be obtained. Then, at step S702, the items in the array searchResultList can be sorted. Specifically, the items with large endIndexInText values can be placed in front to avoid subsequent DOM operations causing DOM damage and resulting in the inability to correctly display search results. The specific implementation method can be: searchResultList.sort(function(a,b){if(a.endIndexInText===b.endIndexInText){return 0}returna.endIndexInText>b.endIndexInText?-1:1}).
[0107] Next, at step S703, a variable can be defined to describe the range of the processed search results. This can avoid problems caused by repeated processing when multiple search results overlap. In some embodiments, min can be used to describe the minimum value of startIndexInText of the processed search results, where the initial value of min is -1, indicating an illegal value. Max can be used to describe the maximum value of endIndexInText of the processed search results, where the initial value of max is -1, indicating an illegal value.
[0108] Then, at step S704, each item searchResult in the sorted searchResultList can be traversed and processed in turn. Specifically, the range represented by startIndexInText and endIndexInText of the search result can be compared with the range represented by min and max. Among them, when it is determined that there is an intersection and the first preset relationship is satisfied (that is, [startIndexInText, endIndexInText) is included by [min, max)), step S705 can be executed without processing the current searchResult, and directly return to step S704 to process the next searchResult. When it is determined that there is an intersection and the second preset relationship is satisfied (that is, endIndexInText≤max, startIndexInText≤max, startIndexInText≤min, max≤max), step S705 can be executed without processing the current searchResult, and return to step S704 directly to process the next searchResult.<min、endIndexInText> min), execute step S706. If it is determined that there is no intersection between the two, step S707 can be directly executed. In addition, since searchResultList is prioritized for sorting, other intersections between the two are rare or will not occur.
[0109] Next, at step S706, startIndexInText, endIndexInText, startNode, endNode, startIndex, and endIndex can be recalculated. Among them, startIndexInText does not need to be adjusted, and endIndexInText is adjusted to min. Then, based on the nodes and textFromNodes of the searchableUnit and the startIndexInText and endIndexInText at this time, startNode, startIndex, endNode, and endIndex are calculated. The specific calculation process here can refer to the text-to-node mapping calculation described above. And step S707 is executed using the recalculated endIndexInText, startNode, startIndex, endNode, and endIndex.
[0110] Then, at step S707, different processing can be performed based on the comparison relationship between startNode and endNode. Specifically, if startNode is equal to endNode, it means that startNode and endNode are the same text node. Among them, if startNode.textContent is completely equal to keyword, the style of the parent node parentNode of startNode can be modified. For example, parentNode.style.backgroudColor can be assigned to yellow. If keyword is not completely equal to startNode.textContent, it means that startNode.textContent contains keyword and other content, then the text content of the matching part can be replaced with a styled DOM element. For example, it can be replaced with <mark>< / mark> HTML element, and assign its CSS background color (backgroud-color) to yellow (for example, it can be implemented through the style.backgroundColor API), and assign its content to the search keyword keyword (for example, it can be implemented through the innerText API).
[0111] Let's use the search results for the keyword "sunshine" described above as an example to further illustrate the method for replacing matching text content (i.e., the search result replacement method). In the second search result for the keyword "sunshine," startNode / endNode are both text nodes: "The sun is bright and beautiful, the breeze is blowing, and the sun is especially comfortable." The startIndex value is 9, the endIndex value is 11, and the keyword value is "sunshine." The text content of startNode can be obtained (text = startNode.textContent). Then, the text can be split into three parts. Among them, textBeforeKeyword (textBeforeKeyword = text.substring (0, startIndex); textKeyword (textKeyword = text.substring (startIndex, endIndex); textAfterKeyword (textAfterKeyword = text.substring (endIndex). Then, the text of textBeforeKeyword can be assigned to startNode (startNode.textContent = textBoforeKeyword). Then, create a mark element based on textKeyword to add a background color (for example, let mark = document.createElement ('mark'), mark.style.backgroudColor = 'yellow'), and use textKeyword as the content of the mark element (for example, mark.innerText = textKeyword), and add the mark element to the back of startNode (for example, startNode.parentNode.insertBefore (mark, startNode.nextSibling)). Finally, a new text node can be created based on textAfterKeyword, and the new text node can be added to the back of the mark element.
[0112] In some embodiments, if startNode and endNode are different text nodes.
[0113] 1) You can process startNode first. Specifically, if there is only one text node under the parent node parentNode of startNode, and startIndex is 0, then modify the style of the parent node parentNode. For example, you can assign parentNode.style.backgroudColor to yellow. If there is more than one text node under the parent node parentNode of startNode, you can replace the text content from startIndex to the end of startNode.textContext with a styled DOM element based on startNode and startIndex. Among them, the specific text content replacement process can refer to the search result replacement method described above.
[0114] 2) EndNode can be processed. If there is only one text node under the parent node parentNode of endNode, and endIndex is the length of the text string of endNode (i.e., endNode.textContent.length), then the style of the parent node parentNode is modified, for example, parentNode.style.backgroudColor is assigned to yellow. Otherwise, the text content from 0 to endIndex in endNode.textContent can be replaced with a styled DOM element based on endNode and endIndex. The specific text content replacement process can refer to the search result replacement method described above.
[0115] 3) The text nodes between startNode and endNode can be processed. In some embodiments, using the nodes under searchableUnit, the serial number startNodeIndex of startNode in nodes can be obtained (startNodeIndex = nodes.indexOf(startNode)). Then, using the nodes under searchableUnit, the serial number endNodeIndex of endNode in nodes can be obtained (endNodeIndex = nodes.indexOf(endNode)). Finally, using startNodeIndex and endNodeIndex, the middle text node array middleNodes can be obtained.
[0116] In some embodiments, by traversing each node under nodes, if its sequence number in the array is greater than startNodeIndex and less than endNodeIndex, it is an intermediate node. Then traverse the intermediate text node array middleNodes and process each intermediate text node middleNode. Among them, if there is only one text node of middleNode under the parent node parentNode of middleNode, the style of the parent node parentNode is modified (for example, parentNode.style.backgroudColor can be assigned to yellow). If there is more than one text node under the parent node parentNode of middleNode, middleNode is replaced with a styled DOM element. The specific content replacement process can refer to the search result replacement method described above.
[0117] After executing step S707, the min and max values can be updated in step S708, and the process returns to step S704 to process the next searchResult until all search results have been processed. Specifically, min can be updated to the startIndexInText of the current searchResult. If max is -1, max will be updated to the endIndexInText of the current searchResult.
[0118] The following is a specific example of Figure 7 The individual steps described are further explained:
[0119] Suppose there is a piece of HTML: today <em> Positive< / em> Light bright The weather was beautiful, the breeze was gentle, and the sunshine was particularly comfortable. . Then, its search unit searchableUnit is: nodes: text node array, containing text nodes "Today", "Yang", "Guang", "Bright", "Mei, the breeze is blowing, and the sun is particularly comfortable."; textFromNodes: value is the string "Today is sunny, the breeze is blowing, and the sun is particularly comfortable." If you search for "sunny", the search result is: keyword: value is the string "sunny"; startIndexInText: value is 2; endIndexInText: value is 6; startNode: value is the text node "Yang"; startIndex: value is 0; endNode: value is the text node "Mei, the breeze is blowing, and the sun is particularly comfortable."; endIndex: value 1.
[0120] according to Figure 7 The processing steps described in are used to process the search result searchResult of this passage. Among them, tartNode and endNode are different text nodes. The specific processing process is as follows:
[0121] i. Process startNode "Yang". Its parent node " <em> Positive< / em> " has only one child node startNode, and startIndex is 0, which meets the condition of [if the parent node parentNode of startNode has only this startNode as a text node and startIndex is 0], and the style of the parent node " <em> Positive< / em> " can be modified.
[0122] ii. Process endNode "Mei, the gentle breeze is blowing, and the sun is shining very comfortably.". Among them, endIndex is 1, which does not meet the condition of [if the parent node parentNode of endNode has only this endNode as a text node and endIndex is the length of the text string of endNode (i.e., endNode.textContent.length)]. Then, according to endNode and endIndex, the text content from 0 to endIndex in endNode.textContent is replaced with a styled DOM element (specifically, the search result replacement method in the previous text can be referred to). After processing, endNode becomes "", that is, an empty text node. At this time, the text nodes included in nodes become "Today", "Yang", "Guang", "Ming", ""; there is a mark element after endNode, and there is a text node "Mei" under this element; there is a text node ", the gentle breeze is blowing, and the sun is shining very comfortably." after the mark element.
[0123] iii. Process the text nodes between startNode and endNode.
[0124] Specifically, (1) calculate startNodeIndex = nodes.indexOf(startNode), where the value of startNodeIndex is 1. (2) Calculate endNodeIndex = nodes.indexOf(endNode), where the value of endNodeIndex is 4. (3) Calculate middleNodes, whose value is the text node array "light", "brightness". At this time, the text nodes included in the array nodes are "today", "sun", "light", "brightness", ""; the text nodes in the array nodes that satisfy the serial number being greater than startNodeIndex and less than endNodeIndex are: "light", "brightness", and these text nodes form a new array middleNodes. (4) Traverse the intermediate text node array middleNodes and process each intermediate text node middleNode. Specifically, process the text node middleNode "light", which does not meet the condition of [if there is only one text node middleNode under the parentNode of middleNode], then replace middleNode with a styled DOM element. The corresponding processing result is that middleNode is replaced with a mark element, and there is a text node "light" under this element. Process the text node "brightness", which meets the condition of [if there is only one text node middleNode under the parentNode of middleNode], then modify the style of the parentNode.
[0125] iv. Update min and max, and process the next searchResult until all search results are processed. Among them, min is updated to the startIndexInText of the current searchResult (the updated value of min is 2). If max is -1, it is updated to the endIndexInText of the current searchResult (the updated value of max is 6). At this time, all search results have been processed, and the process ends.
[0126] Based on this, the solution of the present invention can achieve precise search for keywords in a web page on the browser side, and the search processing results are more in line with semantics. In addition, it can support cross-tag keyword content, support multi-keyword search, support full-page search and partial search (specifically implemented according to the search unit related to the full page or partial page), and also support simultaneous highlighting of keywords.
[0127] In addition, the present invention can also control the web page to scroll to the location of the search results. Specifically, in response to the display requirements for the specified search results, the location information of the specified search results is calculated. Then, the location information of the specified search results is used to control the web page to scroll to the location of the specified search results. In some embodiments, based on the startNode in the search results, the parent node parentNode of the startNode can be obtained (let parentNode=startNode.parentNode). The parent node parentNode is generally an HTML element, and the relative viewport (viewport) DOMRect object rect can be obtained through the getBoundingClientRect API (let rect=parentNode.getBoundingClientRect()). Then, call the window.scrollTo() API to let the web page scroll to the search result location (for example, window.scrollTo(rect.left,rect.top)).
[0128] Exemplary devices
[0129] After introducing the method of the exemplary embodiment of the present invention, next, reference is made to Figure 8 A related product for performing text search on web pages according to an exemplary embodiment of the present invention is described.
[0130] Figure 8 Schematically shows a schematic block diagram of a device 800 according to an embodiment of the present invention. Figure 8 As shown, the device 800 may include a processor 801 and a memory 802. The memory 802 stores computer instructions for performing text search on web pages. When the computer instructions are executed by the processor 801, the device 800 performs the above-mentioned Figure 2 as well as Figures 4 to 7 For example, in some embodiments, the device 800 can acquire a search unit, perform keyword search processing on the search unit, display search results, etc. Based on this, the device 800 can realize accurate search of keywords in web pages on the browser side.
[0131] In some implementation scenarios, the device 800 may include a terminal device (such as a personal PC, a computer, a mobile phone, an educational device, and other devices that can support web browsing, etc.).
[0132] It should be noted that although the above detailed description mentions several devices or sub-devices of the apparatus for performing text search on web pages, this division is not mandatory. In fact, according to embodiments of the present invention, the features and functions of two or more devices described above may be embodied in a single device. Conversely, the features and functions of a single device described above may be further divided and embodied by multiple devices.
[0133] Furthermore, although the operations of the present method are described in a particular order in the accompanying drawings, this does not require or imply that the operations must be performed in that particular order, or that all of the operations shown must be performed to achieve the desired results. Rather, the steps depicted in the flowcharts may be performed in a different order. Additionally or alternatively, certain steps may be omitted, multiple steps may be combined into a single step, and / or a single step may be broken down into multiple steps.
[0134] The use of the verbs "comprise", "include" and their conjugations in the application documents does not exclude the presence of elements or steps other than those stated in the application documents. The article "a" or "an" preceding an element does not exclude the presence of a plurality of such elements.
[0135] Although the spirit and principles of the present invention have been described with reference to several specific embodiments, it should be understood that the present invention is not limited to the specific embodiments disclosed, and the division into various aspects does not mean that the features of these aspects cannot be combined to benefit. Such division is merely for the convenience of expression. The present invention is intended to cover various modifications and equivalent arrangements included within the spirit and scope of the appended claims. The scope of the appended claims is to be accorded the broadest interpretation so as to encompass all such modifications and equivalent structures and functions.< / em>
Claims
1. A method for performing text search on a web page, characterized in that: include: Obtaining one or more search units related to text content in a webpage, wherein each of the search units includes semantically complete text content; In response to a search demand for text content in the webpage, performing keyword search processing on the search unit in units of the search unit to obtain keyword search results related to the text content in the webpage; as well as Displaying the keyword search results on the webpage specifically includes: Sorting the search results of the keyword; and Traverse the sorted search results and perform corresponding highlight display processing in turn according to the relationship between the search results to be processed and the range of processed search results, wherein, in response to the search results to be processed having no intersection with the range of processed search results, directly perform corresponding display operations based on the comparison results between the start text node and the end text node matched by the keyword in the search results to be processed; in response to the search results to be processed having an intersection with the range of processed search results and satisfying a first preset relationship, directly perform processing on the next search result to be processed; in response to the search results to be processed having an intersection with the range of processed search results and satisfying a second preset relationship, recalculate the position information of the keyword in the search results to be processed in the document object model tree, and perform corresponding display operations based on the recalculated comparison results between the start text node and the end text node matched by the keyword in the search results to be processed.
2. The method according to claim 1, wherein Obtaining one or more search units about text content in a web page includes: Traversing the document object model tree of the HTML document of the web page to obtain text nodes; and The search unit is determined according to the text node.
3. The method according to claim 2, characterized in that Performing keyword search processing on the search unit includes: One or more keyword search processes are performed on the text content corresponding to the text node in the search unit.
4. The method according to claim 3, characterized in that For each keyword, keyword search processing includes: A search result for the keyword is obtained from the starting position of the keyword in the text content of the search unit using a text-to-node mapping algorithm, and the next search result is determined from the ending position of the search result in the text content of the search unit using the text-to-node mapping algorithm until the search unit is searched, wherein each search result includes the keyword and the position information of the keyword in the document object model tree.
5. The method according to claim 4, characterized in that The position information of the keyword in the document object model tree includes the starting position and ending position of the keyword in the text content of the search unit, the starting text node and ending text node matched by the keyword, the starting position in the text content of the starting text node, and the ending position in the text content of the ending text node, wherein a search result of the keyword obtained by using the text-to-node mapping algorithm includes: Determining an end position of the keyword in the text content of the search unit by using the start position of the keyword in the text content of the search unit and the length of the keyword; Determining a start text node matched by the keyword and a start position in the text content of the start text node using the text nodes in the search unit and the start position of the keyword in the text content of the search unit; and The end text node matched by the keyword and the end position in the text content of the end text node are determined by using the text node in the search unit and the end position of the keyword in the text content of the end text node.
6. The method according to claim 5, characterized in that Displaying the keyword search results on the webpage includes: Using the search results of the keywords, one or more keywords are highlighted in the web page.
7. The method according to claim 2, characterized in that Executing corresponding display operations includes: In response to the start text node and the end text node matched by the keyword in the pending search result being the same, modifying the style of the parent node of the start text node matched by the keyword in the pending search result; In response to the start text node and the end text node matched by the keyword in the pending search result being different, the text content of the matched portion is determined and replaced with a styled document object model tree element.
8. The method according to claim 6, wherein Also includes: In response to a display demand for a specified search result, calculating position information of the specified search result; as well as The webpage is controlled to scroll to the location of the specified search result using the location information of the specified search result.
9. The method according to claim 2, characterized in that Sorting the search results of the keyword includes: The search results are sorted in descending order according to the size of the end position of the keyword in the text content of the search unit.
10. The method according to any one of claims 2 to 9, characterized in that Traversing the document object model tree of the HTML document of the web page includes: Extracting from the document object model tree text nodes that have the same nearest ancestor block-level element, the same block-level depth, and are consecutively adjacent, wherein the block-level depth of the text node refers to the number of block-level elements passed from the root node of the document object model tree to the text node; and / or A text node that is alone under a block-level element and has no adjacent nodes is extracted from the document object model tree.
11. An electronic device, characterized in that: include: processor; as well as A memory storing computer instructions for performing text search on web pages, wherein when the computer instructions are executed by the processor, the electronic device executes the method according to any one of claims 1 to 10.
12. A computer-readable storage medium, characterized in that The invention comprises program instructions for performing text search on web pages, and when the program instructions are executed by a processor, the method according to any one of claims 1 to 10 is implemented.
Citation Information
Patent Citations
Method for carrying out searching in browser and browser device
CN104484387A
Method for translating webpage and related product thereof
CN114154092A