[發明專利]一種網頁拾色器的制作方法

在審

• 申請號: 201610988463.2
• 申請日: 2016-11-10
• 公開（公告）號: CN106776687A
• 公開（公告）日: 2017-05-31
• 發明（設計）人: 黃博;關班記;張遠世;齊兆勇;龐毅;何龍泉;季統凱
• 申請（專利權）人: 國云科技股份有限公司
• 主分類號: G06F17/30
• 分類號: G06F17/30
• 代理公司: 廣東莞信律師事務所44332
• 代理人: 余倫

1.一種網頁拾色器的制作方法，其特征在于：所述的方法是新建文件夾，所述的文件夾可取名getWebColors；在所述的文件夾里新建index.php、jquery.min.js、getWebColors.php和style.css四個文件；

所述的index.php用于程序入口，用戶交互，顯示輸入框、按鈕及拾取的顏色；

所述的jquery.min.js引入JQ插件，方便JS程序的開發；

所述的getWebColors.php為后端PHP功能文件，用于處理輸入的URL，解析CSS路徑，抓取顏色代碼及輸出到前端；

所述的style.css用于編寫index樣式，提供美觀界面；

在本地PHP環境下或在線PHP服務器環境下，用戶進入index.php程序入口，在中間的文本輸入框中輸入需要提取網頁配色的網頁的網址URL，點擊按鈕“生成該網頁配色”，然后可在下方看到排列整齊的該網頁的配色列表，列表中包含顏色實例和顏色代碼值。

2.根據權利要求1所述的方法，其特征在于：所述的index.php功能實現方法是：

(1)、首先設計出一個文本輸入框和一個按鈕，文本輸入框用于輸入URL網址，按鈕用于啟動AJAX抓取數據，抓取到的數據仍然在本頁顯示；

(2)、設計一個空的顏色列表，包含顏色實例和下方的顏色代碼值，先用測試的數據寫樣式，然后再把內容清掉；

(3)、編寫JQ的AJAX代碼，用于將URL數據傳送到后臺，同時返回后臺輸出的顏色JSON數據；其中AJAX參數的URL為“getWebColors.php”；返回成功的函數里，將JSON字符串解析為JSON對象；通過一個for循環，將每一個顏色代碼進行提取，利用JQ的before函數將每個提取的顏色組成一個li列表單元，添加到指定的ul列表里。

3.根據權利要求1或2所述的方法，其特征在于：所述的getWebColors.php功能實現方法是

(1)、獲取index.php傳送過來的URL參數，利用PHP的file_get_contents函數將該頁面內容存儲為一個字符串變量；

(2)、利用PHP的preg_match_all函數將匹配正則為“/<link href＝/″(.*？)/″/i”的字符串提取；該正則的作用是提取主要CSS的link標簽里的href屬性里的內容，即路徑；

(3)、用正則將網頁域名取到存到變量$host，然后判斷第二步取到的CSS路徑字符串是否為絕對路徑，即是否包含“http”字眼；若為絕對路徑則不操作，若為相對路徑則前面加上域名，組成新的絕對路徑；以得到完成的CSS樣式路徑；

(4)、對CSS絕對路徑使用PHP函數file_get_contents讀取CSS內容，存儲為字符串變量；在這個字符串中利用PHP函數preg_match_all進行正則匹配，正則表達式為“/color：#[0-9a-zA-Z]{3，6}/i”，以匹配顏色代碼的字符串，采用形式為color：#000，將所有匹配的存儲在一個數組里；

(5)、用函數array_unique去除重復值，用函數array_merge重新將鍵值排序，然后用PHP函數json_encode轉成JSON，輸出，該輸出會返回到index.php。