一種網頁Table中目標單元格的行列高亮顯示方法
2023-05-04 08:39:01 3
一種網頁Table中目標單元格的行列高亮顯示方法
【專利摘要】本發明提出了一種網頁Table中目標單元格的行列高亮顯示方法，所述方法包括以下步驟：a.通過瀏覽器瀏覽包含有Table標籤的網頁；b.獲取目標單元格所在行的值R和列的值C、rowspan屬性值M和colspan屬性值N；c.高亮顯示目標單元格所在的行和列，且目標單元格顯示為區別於高亮顯示顏色的其他顏色；d.目標單元格行值或列值變化時，高亮顯示的行或列隨之變化，原高亮顯示的行或列恢復原顯示顏色。本發明實現了網頁Table中目標單元格的行列高亮顯示，用戶不需要把Table轉換成Excel或WPS表格即可實現在網頁中選中一個或幾個單元格時高亮顯示該單元格所在的行和列，同時區別和突出顯示選中的單元格；解決了用戶面對大量單元格時查看目標單元格行信息和列信息不便的技術問題。
【專利說明】—種網頁Table中目標單元格的行列高亮顯示方法
【技術領域】
[0001]本發明涉及表格應用【技術領域】，特別涉及一種網頁Table中目標單元格的行列高亮顯示方法。
【背景技術】
[0002]目前的辦公軟體在電子表格應用方面正越來越向增強用戶體驗的方向發展，例如Excel中，用戶選中電子表格的某個單元格時，該單元格會以加粗加黑邊框的效果顯示；當用戶選中多個單元格時，選中的單元格會以區別於其他單元格背景色的方式顯示。該方法實現了選中單元格突出顯示的效果。WPS表格中，在普通模式下，功能和Excel類似；在閱讀模式的狀態下，用戶選中某個單元格時，該單元格會以加粗加黑邊框的效果顯示，且該單元格所在的行和列以某種顏色高亮顯示，該方法不僅突出顯示單元格而且可以很方便地看到單元格的所在行列的信息。
[0003]網頁中使用表格已是一種很普遍的現象，但是網頁中表格的單元格要麼不能突出顯示；要麼是在編輯時已經定好如何顯示背景色和前景色，是靜態的，不能靈活變化。如果在閱讀的過程中能突出顯示網頁中的單元格，那麼用戶體驗將進一步增強。按照現有的技術，若要實現突出顯示網頁表格單元格的效果，需要把網頁中的電子表格先轉換成Excel表格或WPS表格，然後使用Excel和WPS表格的功能突出顯示。顯然，這種實現方式比較繁瑣和費時，不能一步到位。
【發明內容】
[0004]針對以上問題，本發明提出了一種網頁Table中目標單元格的行列高亮顯示方法，通過事先定義TD節點的列屬性，瀏覽含有Table標籤的網頁，獲取目標單元格所在的行列值以及是否是合併單元格，高亮顯示目標單元格所在的行和列。
[0005]為實現上述
【發明內容】
，本發明採用了一種網頁Table中目標單元格的行列高亮顯示方法，該方法的技術方案如下:
[0006]a.通過瀏覽器瀏覽包含有Table標籤的網頁；
[0007]b.獲取目標單元格所在行的值R和列的值C、rowspan屬性值M和colspan屬性值N，若沒有M或N的值則默認值為I ;
[0008]c.高亮顯示目標單元格所在的行和列，且目標單元格顯示為區別於高亮顯示顏色的其他顏色；當M = 1，N = I，高亮顯示的區域為第R行和第C列，且目標單元格區別顯示；當M> LN= 1，目標單元格為行合併單元格，高亮顯示的區域為第R至R+M-1行和第C列，且目標單元格區別顯示；iM= 1，N> 1，目標單元格為列合併單元格，高亮顯示的區域為第R行和第N至N+C-1列，且目標單元格區別顯示；當11> 1，N> 1，目標單元格為M*N區域合併單元格，高亮顯示的區域為第R至R+M-1行和第N至N+C-1列，且目標單元格區別顯示；
[0009]d.目標單元格行值或列值變化時，高亮顯示的行或列隨之變化，原高亮顯示的行或列恢復原顯示顏色。
[0010]所述步驟b獲取目標單元格所在行的值R和列的值C，對於獲得列值C的方法:事先在TD節點中增加自定義列屬性，在Table初始化時將每個TD節點所在的列的序列值保存在該自定義屬性中，通過該自定義屬性匹配的列獲得相應列的TD節點；或者，在瀏覽器內核的解析器中增加對Table中TD節點的列屬性的解析功能，在表格初始化時將每個TD節點所在的列的序列值保存在列屬性中，通過該屬性匹配的列獲得相應列的TD節點，瀏覽器內核解析目標單元格的列值。
[0011]所述目標單元格邊框通過加粗加黑或使用其他色差大的顏色突出顯示。
[0012]目標單元格區域為一個或多個。
[0013]與現有技術相比，本發明實現了網頁Table中目標單元格的行列高亮顯示，通過獲取單元格的行列值及合併信息，用戶不需要把Table轉換成Excel或WPS表格即可實現在網頁中選中一個或幾個單元格時高亮顯示該單元格所在的行和列，同時區別和突出顯示選中的單元格；解決了用戶面對大量單元格時查看目標單元格行信息和列信息的不便。
【專利附圖】
【附圖說明】
[0014]圖1為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的流程圖；
[0015]圖2為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施例一；
[0016]圖3為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施例二 ；
[0017]圖4a為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖一；
[0018]圖4b為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖二；
[0019]圖4c為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖三；
[0020]圖4d為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖四；
[0021]圖4e為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖五。
【具體實施方式】
[0022]為了使本發明所提到的一種網頁Table中目標單元格的行列高亮顯示方法及其優點更加清楚明確，以下參照附圖對本發明進行更進一步的詳細說明。
[0023]圖1為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的流程圖，該流程圖顯示了本發明的主要實現步驟，其內容如下:
[0024]步驟101，通過瀏覽器瀏覽包含有Table標籤的網頁；
[0025]步驟102，獲取目標單元格所在行的值R和所在列的值C、rowspan屬性值M和colspan屬性值N ；
[0026]步驟103，高亮顯示目標單元格所在的行和列，且目標單元格顯示為區別於高亮顯示顏色的其他顏色；
[0027]步驟104，目標單元格行值或列值變化時，高亮顯示的行或列隨之變化，原高亮顯示的行或列恢復原顯示顏色。
[0028]圖2為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施例，該實施例有以下步驟:
[0029]步驟201，事先在TD節點中增加自定義列屬性，在Table初始化時將每個TD節點所在的列的序列值保存在該自定義屬性中。
[0030]現有的HTML語言沒有記錄單元格列的功能函數，為實現本發明中獲取單元格的行值和列值的功能，需事先在TD節點中增加自定義列屬性，對於合併單元格，該屬性有以下特點:
[0031]當表格中新增rowspan或colspan屬性或原有rowspan或colspan屬性值增加時，刪除被rowspan或colspan的TD節點佔位的TD節點；當表格中減小rowspan或colspan屬性值時，新增TD節點填補曾被rowspan或colspan的TD節點佔位。新增TD節點時,根據rowspan或colspan屬性的變化值及所屬TD節點的列屬性為新增TD節點設置相應的自定義列屬性。
[0032]步驟202，通過瀏覽器瀏覽包含有Table標籤的網頁。
[0033]用戶在瀏覽網頁時遇到對其有使用或參考價值的表格，通過點擊滑鼠、敲擊鍵盤、觸控螢幕幕等方式確定目標單元格。
[0034]步驟203，獲取目標單元格所在行的值R和所在列的值C、rowspan屬性值M和colspan屬性值N。
[0035]通過解析Table標籤下的內容，獲取目標單元格在表格中的位置，處於第幾行第幾列；以及目標單元格是否有合併，若是沒有rowspan屬性值和colspan屬性值，則默認M和N的值等於I ;若是rowspan屬性值和colspan屬性值存在,則按照實際值獲取。
[0036]步驟204，高亮顯示目標單元格所在的行和列，且目標單元格顯示為區別於高亮顯示顏色的其他顏色。
[0037]根據步驟203獲得的信息，高亮顯示目標單元格所在的行和列，為了突出顯示目標單元格，其所在區域顯示區別於高亮顯示顏色的其他顏色；為進一步增強用戶的視覺體驗，對於目標單元格的邊框，使用加粗加黑或者其他顏色突出顯示。
[0038]步驟205,目標單元格位置是否變化。
[0039]在同一個表格中，若目標單兀格從一個轉換到另一個時，目標單兀格位置發生變化，其所在行數或列數會發生變化或者行數和列數同時發生變化，重新執行步驟203，高亮顯示的區域隨著目標單元格的變化而變化顯示，被移出的原高亮顯示區域恢復原顯示顏色。
[0040]若目標單元格是多個，則同時高亮顯示每個單元格所在的行和列，對於重疊的區域，按單個的情況處理。
[0041]步驟206，結束。
[0042]在某表格中，若目標單元格位置不再發生變化，而是直接轉移至下一個表或網頁，則執行步驟206，在該表格中的高亮顯示操作結束。
[0043]圖3為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施例二，該實施例有以下步驟:
[0044]步驟301，事先在瀏覽器內核的解析器中增加對Table中TD節點的列屬性的解析功能，在Table初始化時將每個TD節點所在的列的序列值保存在列屬性中。
[0045]步驟302，通過瀏覽器瀏覽包含有Table標籤的網頁。
[0046]步驟303，瀏覽器內核解析獲取目標單元格所在行的值R和所在列的值Cjowspan屬性值M和colspan屬性值N。
[0047]步驟304，高亮顯示目標單元格所在的行和列，且目標單元格顯示為區別於高亮顯示顏色的其他顏色。
[0048]步驟305，判斷目標單元格位置是否變化。
[0049]步驟306，結束。
[0050]該實施例的步驟和實施例一的不同在於步驟301，在瀏覽器內核的解析器中增加對表格中TD節點的列屬性的解析功能。
[0051]現有的HTML語言沒有記錄單元格列的功能函數，為實現本發明中獲取單元格的行值和列值的功能，也可在瀏覽器內核的解析器中增加對表格中TD節點的列屬性的解析功能。在表格初始化時將每個TD節點所在的列的序列值保存在列屬性中，通過該屬性匹配的列獲得相應列的TD節點。
[0052]圖4a為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖一，其實現過程為:通過解析Table標籤下的內容可知目標單元格A位於第三行第二列，且M= 1，N= 1，則高亮顯示的區域為第三行和第二列，同時目標單元格A以原頁面顏色顯示且邊框加粗加黑；
[0053]圖4b為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖二，其實現過程為:目標單元格由A轉換成B，通過解析Table標籤下的內容可知目標單元格B位於第三行第三列，且M = LN = 2，則高亮顯示的區域是變成第三行和第三列、第四列，同時目標單元格B以原頁面顏色顯示且邊框加粗加黑。第三行因仍在高亮顯示區域，故其顏色是高亮顯示的顏色；
[0054]圖4c為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖三，其實現過程為:通過解析Table標籤下的內容可知目標單元格C位於第三行第二列，且M= 2，N= 1，則高亮顯示的區域是第三行、第四行和第二列，同時目標單元格C以原頁面顏色顯示且邊框加粗加黑；
[0055]圖4d為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖四，其實現過程為:通過解析Table標籤下的內容可知目標單元格D位於第三行第二列，且M= 2，N= 2，則高亮顯示的區域是第三行、第四行和第二列、第三列，同時目標單元格以原頁面顏色顯示且邊框加粗加黑；
[0056]圖4e為本發明所提供的一種網頁Table中目標單元格的行列高亮顯示方法的實施效果圖五，通過解析Table標籤下的內容可知目標單元格E、F分別位於第三行第二列和第五行第三列，目標單元格都不存在合併的情況，因此高亮顯示的區域是第三行第二列和第五行第三列，同時目標單元格E、F以原頁面顏色顯示且邊框加粗加黑。[0057]以上所述是對本發明的較佳的【具體實施方式】，本【技術領域】人員應當理解，所述實施方式並非限定本發明的保護範圍。在不脫離本發明的精神實質和原則下，在細節方面可以進行變化或者修改，均應涵蓋在本發明的權利要求範圍之內。
【權利要求】
1.一種網頁Table中目標單元格的行列高亮顯示方法，其特徵在於，所述方法包括以下步驟: a.通過瀏覽器瀏覽包含有Table標籤的網頁； b.獲取目標單元格所在行的值R和列的值C、rowspan屬性值M和colspan屬性值N，若沒有M或N的值則默認值為I ; c.高亮顯示目標單元格所在的行和列，且目標單元格顯示為區別於高亮顯示顏色的其他顏色；當M= 1，N= 1，高亮顯示的區域為第R行和第C列，且目標單元格區別顯示；當皿> 1，N= 1，目標單元格為行合併單元格，高亮顯示的區域為第R至R+M-1行和第C列，且目標單元格區別顯示；iM= 1，N> 1，目標單元格為列合併單元格，高亮顯示的區域為第R行和第N至N+C-1列，且目標單元格區別顯示；當M > I, N > I,目標單元格為M*N區域合併單元格，高亮顯示的區域為第R至R+M-1行和第N至N+C-1列，且目標單元格區別顯示； d.目標單元格行值或列值變化時，高亮顯示的行或列隨之變化，原高亮顯示的行或列恢復原顯示顏色。
2.如權利要求1所述的一種網頁Table中目標單元格的行列高亮顯示方法，其特徵在於，所述步驟b獲取目標單元格所在行的值R和列的值C，對於獲得列值C的方法:事先在TD節點中增加自定義列屬性，在Table初始化時將每個TD節點所在的列的序列值保存在該自定義屬性中，通過該自定義屬性匹配的列獲得相應列的TD節點；或者，在瀏覽器內核的解析器中增加對Table中TD節點的列屬性的解析功能，在表格初始化時將每個TD節點所在的列的序列值保存在列屬性中，通過該屬性匹配的列獲得相應列的TD節點，瀏覽器內核解析目標單元格的列值。
3.如權利要求1所述的一種網頁Table中目標單元格的行列高亮顯示方法，其特徵在於，所述目標單元格邊框通過加粗加黑或使用其他色差大的顏色突出顯示。
4.如權利要求1或2所述的一種網頁Table中目標單元格的行列高亮顯示方法，其特徵在於，目標單元格區域為一個或多個。
【文檔編號】G06F17/30GK103970735SQ201310027184
【公開日】2014年8月6日 申請日期:2013年1月25日 優先權日:2013年1月25日
【發明者】牟春林 申請人:蘇州精易會信息技術有限公司