如何從任何網站擷取圖片
2026年6月18日 · 6 分鐘閱讀
從網站擷取圖片，指的是把頁面背後真正的圖片檔案抽出來，讓你能預覽、複製或儲存。難處在於許多圖片並不是單純的 <img> 標籤，所以陽春工具根本看不到它們。以下說明如何觸及頁面上的每一張圖片，並以完整解析度抓取。
圖片藏在頁面的哪些地方
在你擷取圖片之前，先了解它們藏在哪裡會很有幫助。一個典型的頁面混雜了好幾種視覺內容：
- 標準圖片。每一個
<img>標籤，加上srcset中的響應式來源。 - CSS 背景。在樣式表中設定的圖片，包含只在 hover 時，或在
::before與::after狀態下才出現的那些。 - 延遲載入的圖片。只在捲動進入可視範圍時才載入的圖片。
- Shadow DOM 與 iframe。對簡單掃描隱藏其內容的小工具與內嵌元件。
- Canvas 與內嵌 SVG。由瀏覽器算繪而非下載的圖形。
- JavaScript 載入的媒體。頁面載入後才抓取的輪播畫格與動態消息圖片。
用 PicGrab 擷取每一張圖片
PicGrab 會掃描你正在瀏覽的頁面，並呈現它能觸及的每一張圖片，涵蓋上述所有來源。它甚至有一份被動式網路日誌，會記錄由 JavaScript 載入的圖片回應並併入掃描，因此輪播畫格與透過 fetch 載入的媒體不會遺漏。你會得到一個乾淨的格狀清單、依尺寸與類型的篩選，以及一鍵批次下載。掃描器只在你要求時才執行，所以不會有任何東西在背景常駐於每個頁面。
取得完整解析度，而非縮圖
許多網站只顯示一張小預覽圖，僅在需要時才載入大檔。PicGrab 讀取的是每張圖片真正的來源，而非螢幕上縮小的版本，因此只要有完整解析度的檔案，你就能取得。對於透過版面找到的圖片，例如 CSS 背景，它會在背景探測真實尺寸，並把尺寸標籤從估計值更新為精確的像素大小。
先擷取，再決定怎麼處理
擷取只是第一步。圖片列出來之後，你可以：
- 下載單一圖片，或複選多張並批次下載。
- 在新分頁開啟任何圖片以檢視它。
- 複製圖片網址以在別處使用。
- 用 Google Lens 搜尋圖片以追溯來源。
篩選出重要的圖片
長長一串清單，唯有在你能縮小範圍時才有用。依最小尺寸篩選以剔除圖示、依檔案類型符合你的需求、依形狀對應特定版面，或依網址或 alt 屬性中的文字篩選。接著依尺寸或頁面順序排序，就能快速找到對的圖片。
擷取受限的頁面
有幾項限制值得了解。瀏覽器系統頁面，例如擴充功能頁面與線上應用程式商店，對所有擴充功能都是禁區。跨來源的 canvas 元素被瀏覽器封鎖，無法匯出。還有些圖片即使容易擷取，仍受權利保護，所以請務必確認你獲准使用所儲存的內容。
擷取圖片的應用情境
擷取圖片是許多日常工作的第一步。設計師用參考素材打造情緒板。內容團隊稽核競爭對手在到達頁上使用了哪些圖片。研究人員在頁面變動前封存視覺資料。開發者把原型頁面上的每個素材抽出來以重建它。連品質檢查也仰賴它：列出頁面上的每一張圖片，能輕鬆找出失效的來源、低解析度的主視覺，或一張多餘的佔位圖。由於 PicGrab 會顯示每張圖片真正的來源網址與真實尺寸，你得到的是一份頁面的精確清單，而不只是一堆檔案。
從棘手的頁面擷取
有些頁面會反擊。無限滾動動態消息只在你捲動時才顯示圖片，單頁式應用程式不重新載入就更換內容，圖庫則只在點擊時才載入高解析度版本。突破之道是深度掃描搭配被動式網路日誌：掃描會迫使延遲內容載入，日誌則記錄 JavaScript 在背景抓取的圖片回應，因此輪播畫格與隨選媒體會被捕捉下來而非遺失。結果就是頁面實際載入內容的完整全集，即使這些內容在原始 HTML 中完全看不到。
常見問題
從網站擷取圖片是什麼意思？
意思是把頁面底層的圖片檔案抽出來，包含背景圖與延遲載入的圖片，讓你能預覽、複製或下載它們。
我能擷取 CSS 背景圖嗎？
可以。PicGrab 會找出 CSS 背景，包含 hover 與虛擬元素狀態，以及 canvas、內嵌 SVG 與 JavaScript 載入的媒體。
我會拿到完整解析度的圖片嗎？
PicGrab 讀取的是真正的來源，而非螢幕上的縮圖，所以只要網站有提供，你就能取得完整解析度的檔案。
擷取圖片合法嗎？
擷取是技術層面；使用圖片才是問題所在。許多圖片受著作權保護，所以請確認你有權使用任何儲存的內容。
我能不下載就複製一張圖片嗎？
可以。對任何圖片，你都能複製它的網址，或在新分頁開啟它，這在你只需要連結或快速一瞥時很方便。
為什麼找到的圖片比我預期的少？
通常是因為頁面是需要深度掃描的動態消息，或是某個尺寸篩選把較小的圖片藏起來了。執行深度掃描並清除篩選，就能看到完整全集。