Save All Resources插件背景簡介
當我們在網頁上看到一個好看的H5頁面,或者是相當酷炫的JS動畫,一個很自然的想法就是F12,然后下載資源占為己有。F12是前端開發人員的利器,在Chrome開發者工具中,調試時使用最多的功能有:ELements(元素)、Console(控制臺)、Sources(源代碼),Network(網絡)等。其中,Sources可以找到當前頁面使用的所有資源。如果你要做一個橫向輪播圖的特效,然后找到的網頁如下所示:
它的Sources文件內容如下圖:
要保存網站內容,一種做法是直接右鍵另存為整個網頁。雖然有時網頁也能正常運行,但不可避免地丟失了網站文件夾結構。當然,你也可以在Sources中挨個文件地另存為,然后重新建立文件夾結構。但此種做法,只能應對資源量較少的網頁,而且操作繁瑣。這里,推薦一個谷歌瀏覽器插件:Save All Resources。
Save All Resources插件簡介
經常在仿站的時候回遇到下載別人的圖片、css、js等資源,發現要一個個的手動下載。直接使用仿站工具有時候覺得比較麻煩而且會打亂目錄結構。Save All Resources插件可以一鍵下載當前網站所有資源。
Save All Resources插件使用方法
1.Save All Resources插件離線安裝的方法參照一下方法:老版本chrome瀏覽器,首先在標簽頁輸入【chrome://extensions/】進入chrome擴展程序,解壓你在本站下載的插件,并拖入擴展程序頁即可。
2.最新版本的chrome瀏覽器直接拖放安裝時會出現“程序包無效CRX-HEADER-INVALID”的報錯信息,參照:Chrome插件安裝時出現"CRX-HEADER-INVALID"解決方法。安裝好后即可使用。
3.安裝好以后會出現個圖標,大概就是這個樣子,
4.審查元素,審查元素后,翻到最后一個選項,點擊Save All Resources即可
5.下載內容是一個壓縮文件,解壓后如圖:
Save All Resources插件聯系方法
github地址:https://github.com/up209d/ResourcesSaverExt
Save All Resources - 一鍵下載網頁資源下載地址
點擊下載Save All Resources - 一鍵下載網頁資源
轉載必須注明來自: Chrome插件 ? Save All Resources - 一鍵下載網頁資源