本技術(shù)涉及前端開發(fā)領(lǐng)域，具體而言，涉及一種互聯(lián)網(wǎng)頁面的定位方法、裝置及電子設(shè)備。

背景技術(shù)：

1、錨點是互聯(lián)網(wǎng)頁面中的一種定位器，可以通過用戶的操作使當(dāng)前頁面快速到達頁面中的指定元素。一個錨點包括兩個部分，第一部分是被定位的元素，即命名錨記，比如頁面頂部的元素或其他重要元素；第二部分是幫助互聯(lián)網(wǎng)頁面實現(xiàn)定位到命名錨記的部分，這一部分是附著了hash(錨)路由的link(鏈接)標簽，因此稱之為錨記鏈接。將網(wǎng)頁類比為文檔，命名錨記即對應(yīng)文檔中章節(jié)標題，而錨記鏈接對應(yīng)文檔的目錄，通過點擊目錄，文檔會跳到指定章節(jié)，而點擊錨記鏈接，網(wǎng)頁也會滾動到命名錨記。錨點可以幫助用戶迅速定位到網(wǎng)頁中關(guān)心的元素，大部分網(wǎng)頁都提供了錨點的功能。

2、隨著互聯(lián)網(wǎng)的發(fā)展，網(wǎng)頁已經(jīng)成為用戶獲取資訊最主要的方式之一。然而，相關(guān)技術(shù)中大部分網(wǎng)頁都是在設(shè)計階段去調(diào)研評估用戶關(guān)心的內(nèi)容，并在開發(fā)時內(nèi)置于頁面，網(wǎng)頁開發(fā)時設(shè)置的錨點很多時候無法真正滿足用戶的需求，如果用戶關(guān)注的內(nèi)容不在內(nèi)置的錨點范圍內(nèi)，則可能給用戶的瀏覽造成不便。

技術(shù)實現(xiàn)思路

1、本技術(shù)的主要目的在于提供一種互聯(lián)網(wǎng)頁面的定位方法、裝置及電子設(shè)備，以解決相關(guān)技術(shù)中基于互聯(lián)網(wǎng)頁面的內(nèi)置錨點實現(xiàn)的頁面元素定位無法有效滿足用戶需求的問題。

2、為了實現(xiàn)上述目的，根據(jù)本技術(shù)的一個方面，提供了一種互聯(lián)網(wǎng)頁面的定位方法。該方法包括：在為原始頁面構(gòu)建的滾動區(qū)域內(nèi)顯示頁面內(nèi)容以及目標對象的錨點按鈕，其中，滾動區(qū)域用于滑動原始頁面中的頁面內(nèi)容，錨點按鈕鏈接目標對象在頁面內(nèi)容中的位置，錨點按鈕是預(yù)先基于用戶作用于滾動區(qū)域內(nèi)的目標對象上的錨點創(chuàng)建指令創(chuàng)建的；在檢測到對錨點按鈕的點擊指令的情況下，控制滾動區(qū)域滑動頁面，以將目標對象展示在滾動區(qū)域內(nèi)的目標位置上。

3、進一步地，錨點按鈕由以下方式創(chuàng)建：通過事件冒泡機制將原始頁面的所有對象的用戶事件委派給滾動區(qū)域，其中，用戶事件為用戶對原始頁面上的對象的操作指令；接收用戶對滾動區(qū)域內(nèi)的目標對象的錨點創(chuàng)建指令，通過錨點創(chuàng)建指令在滾動區(qū)域內(nèi)創(chuàng)建目標對象的錨點按鈕。

4、進一步地，控制滾動區(qū)域滑動頁面，以將目標對象展示在滾動區(qū)域內(nèi)的目標位置上包括：確定滾動區(qū)域在瀏覽器上的坐標，得到滾動區(qū)域的坐標，確定目標對象在瀏覽器上的對象坐標，確定未滑動前原始頁面的頂部相對于滾動區(qū)域的第一坐標偏移量，其中，在頁面的滾動方向為垂直方向的情況下，滾動區(qū)域的坐標為滾動區(qū)域在瀏覽器上的縱坐標，對象坐標為目標對象在瀏覽器上的縱坐標，在頁面的滾動方向為水平方向的情況下，滾動區(qū)域的坐標為滾動區(qū)域在瀏覽器上的橫坐標，對象坐標為目標對象在瀏覽器上的橫坐標；基于滾動區(qū)域的坐標、對象坐標和第一坐標偏移量計算目標對象相對于滾動區(qū)域的目標坐標偏移量；控制滾動區(qū)域內(nèi)的頁面按照目標坐標偏移量進行滑動，以將目標對象展示在滾動區(qū)域的目標位置。

5、進一步地，基于滾動區(qū)域的坐標、對象坐標和第一坐標偏移量計算目標對象相對于滾動區(qū)域的目標坐標偏移量包括：確定滾動區(qū)域的坐標的第一坐標值和對象坐標的第二坐標值，并計算第一坐標值與第二坐標值的差的絕對值，得到坐標差值；判斷第一坐標值是否大于第二坐標值；在第一坐標值大于第二坐標值的情況下，計算第一坐標偏移量與坐標差值的差，得到目標坐標偏移量；在第一坐標值小于等于第二坐標值的情況下，計算第一坐標偏移量與坐標差值的和，得到目標坐標偏移量。

6、進一步地，在控制滾動區(qū)域內(nèi)的頁面按照目標坐標偏移量進行滑動之前，該方法還包括：確定原始頁面的總長度，計算總長度與目標坐標偏移量的差，得到目標對象相對于原始頁面末端的相對距離，其中，在頁面的滾動方向為垂直方向的情況下，總長度為原始頁面在瀏覽器上的高度，在頁面的滾動方向為水平方向的情況下，總長度為原始頁面在瀏覽器上的寬度；判斷滾動區(qū)域的坐標的第一坐標值是否大于相對距離；在第一坐標值小于等于相對距離的情況下，執(zhí)行控制滾動區(qū)域內(nèi)的頁面按照目標坐標偏移量進行滑動的步驟。

7、進一步地，該方法還包括：在第一坐標值大于相對距離的情況下，計算第一坐標值與目標坐標偏移量的和，并計算和與總長度的差，得到目標長度；將填充節(jié)點在滾動區(qū)域的長度設(shè)置為目標長度，計算目標長度與目標坐標偏移量的和，得到更新后的目標坐標偏移量，控制滾動區(qū)域內(nèi)的頁面按照更新后的目標坐標偏移量進行滑動，其中，填充節(jié)點為在滾動區(qū)域的末端預(yù)設(shè)的長度為初始值的節(jié)點，填充節(jié)點用于填充滾動區(qū)域的末端與目標對象之間的間隙，以將目標對象展示在滾動區(qū)域的目標位置。

8、進一步地，該方法還包括：在檢測到用戶對目標對象的第一點擊事件的情況下，判斷滾動區(qū)域內(nèi)是否存在選中字符；在滾動區(qū)域內(nèi)存在選中字符的情況下，判斷第一點擊事件點擊的是否為選中字符；在第一點擊事件點擊的是選中字符的情況下，阻止第一點擊事件在原始頁面上冒泡，將目標對象存儲至待創(chuàng)建錨點數(shù)據(jù)庫，并在滾動區(qū)域展示錨點創(chuàng)建菜單。

9、進一步地，該方法還包括：在檢測到用戶對錨點創(chuàng)建菜單的點擊事件的情況下，確定用戶選中的目標字符；基于目標字符生成錨點按鈕的按鈕名稱，在滾動區(qū)域創(chuàng)建以按鈕名稱展示在滾動區(qū)域內(nèi)的錨點按鈕，并將錨點按鈕與目標對象進行鏈接。

10、進一步地，該方法還包括：在為原始頁面構(gòu)建的滾動區(qū)域內(nèi)顯示頁面內(nèi)容以及目標對象的錨點按鈕之后，該方法還包括：接收用戶對錨點按鈕的銷毀指令，基于銷毀指令將錨點按鈕從滾動區(qū)域中移除。

11、進一步地，該方法還包括：在檢測到用戶對滾動區(qū)域的第二點擊事件，或者檢測到用戶的光標指示在原始頁面的除滾動區(qū)域以外的區(qū)域的情況下，將目標對象從待創(chuàng)建錨點數(shù)據(jù)庫移除，并隱藏錨點創(chuàng)建菜單。

12、為了實現(xiàn)上述目的，根據(jù)本技術(shù)的另一方面，提供了一種互聯(lián)網(wǎng)頁面的定位裝置。該裝置包括：顯示單元，用于在為原始頁面構(gòu)建的滾動區(qū)域內(nèi)顯示頁面內(nèi)容以及目標對象的錨點按鈕，其中，滾動區(qū)域用于滑動原始頁面中的頁面內(nèi)容，錨點按鈕鏈接目標對象在頁面內(nèi)容中的位置，錨點按鈕是預(yù)先基于用戶作用于滾動區(qū)域內(nèi)的目標對象上的錨點創(chuàng)建指令創(chuàng)建的；控制單元，用于在檢測到對錨點按鈕的點擊指令的情況下，控制滾動區(qū)域滑動頁面，以將目標對象展示在滾動區(qū)域內(nèi)的目標位置上。

13、為了實現(xiàn)上述目的，根據(jù)本技術(shù)的另一方面，提供了一種計算機程序產(chǎn)品，包括計算機程序，所述計算機程序被處理器執(zhí)行時實現(xiàn)本技術(shù)各個實施例中所述互聯(lián)網(wǎng)頁面的定位方法的步驟。

14、根據(jù)本技術(shù)實施例的另一方面，還提供了一種電子設(shè)備，該電子設(shè)備包括一個或多個處理器；存儲裝置，用于存儲一個或多個程序，當(dāng)一個或多個程序被一個或多個處理器執(zhí)行時，使得一個或多個處理器實現(xiàn)用于運行程序，其中，程序被設(shè)置為運行時執(zhí)行上述的互聯(lián)網(wǎng)頁面的定位方法。

15、本技術(shù)實施例通過在為原始頁面構(gòu)建的滾動區(qū)域內(nèi)顯示頁面內(nèi)容以及目標對象的錨點按鈕，其中，滾動區(qū)域用于滑動原始頁面中的頁面內(nèi)容，錨點按鈕鏈接目標對象在頁面內(nèi)容中的位置，錨點按鈕是預(yù)先基于用戶作用于滾動區(qū)域內(nèi)的目標對象上的錨點創(chuàng)建指令創(chuàng)建的；在檢測到對錨點按鈕的點擊指令的情況下，控制滾動區(qū)域滑動頁面，以將目標對象展示在滾動區(qū)域內(nèi)的目標位置上。

16、由上述內(nèi)容可知，本技術(shù)提出的互聯(lián)網(wǎng)頁面的定位方法，與相關(guān)技術(shù)中通過uri(uniform?resource?identifier，統(tǒng)一資源標識符)的hash(錨)組件來對互聯(lián)網(wǎng)頁面進行定位的方法相比，本技術(shù)的互聯(lián)網(wǎng)頁面的定位方法支持用戶自定義錨點，在瀏覽互聯(lián)網(wǎng)頁面的過程中用戶可以隨時增加新的目標對象，并為目標對象構(gòu)建錨點按鈕，供后續(xù)用戶對目標對象快速定位。將目標對象定位到滾動區(qū)域時，能確保目標對象一定在滾動區(qū)域首行，方便用戶精準定位。此外，本技術(shù)的互聯(lián)網(wǎng)頁面的定位方法不依賴特定的前端框架，無論框架是使用服務(wù)端路由還是前端路由(hash路由或者history(歷史)路由)，本方法均能支持。本技術(shù)的互聯(lián)網(wǎng)頁面的定位方法對互聯(lián)網(wǎng)原始頁面的業(yè)務(wù)代碼可以做到零侵擾。

17、由此可見，本技術(shù)的技術(shù)方案達到了對互聯(lián)網(wǎng)頁面自定義錨點的目的，從而實現(xiàn)了提升互聯(lián)網(wǎng)頁面定位的用戶體驗的效果，進而解決了相關(guān)技術(shù)中基于互聯(lián)網(wǎng)頁面的內(nèi)置錨點實現(xiàn)的頁面元素定位無法有效滿足用戶需求的技術(shù)問題。