☰

Image Downloader Button

Adds a download button to every image on the page

目前為 2025-04-11 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name         Image Downloader Button
  3. // @namespace    http://tampermonkey.net/
  4. // @version      1.0
  5. // @description  Adds a download button to every image on the page
  6. // @author       You
  7. // @match        *://*/*
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12.     'use strict';
  13.  
  14.     // Add a download button to each image
  15.     function addDownloadButtons() {
  16.         const images = document.querySelectorAll('img');
  17.         images.forEach(img => {
  18.             // Skip if button already added
  19.             if (img.dataset.hasDownloadButton) return;
  20.  
  21.             // Create button
  22.             const button = document.createElement('button');
  23.             button.textContent = '⬇️';
  24.             button.style.position = 'absolute';
  25.             button.style.top = '5px';
  26.             button.style.left = '5px';
  27.             button.style.zIndex = 9999;
  28.             button.style.background = 'white';
  29.             button.style.border = '1px solid #ccc';
  30.             button.style.cursor = 'pointer';
  31.  
  32.             // Button click downloads the image
  33.             button.addEventListener('click', (e) => {
  34.                 e.stopPropagation();
  35.                 e.preventDefault();
  36.  
  37.                 const link = document.createElement('a');
  38.                 link.href = img.src;
  39.                 link.download = img.src.split('/').pop().split('?')[0]; // try to name file from URL
  40.                 link.click();
  41.             });
  42.  
  43.             // Wrap image in a relative container to position button
  44.             const wrapper = document.createElement('div');
  45.             wrapper.style.position = 'relative';
  46.             wrapper.style.display = 'inline-block';
  47.             img.parentNode.insertBefore(wrapper, img);
  48.             wrapper.appendChild(img);
  49.             wrapper.appendChild(button);
  50.  
  51.             img.dataset.hasDownloadButton = true;
  52.         });
  53.     }
  54.  
  55.     // Run after DOM loads
  56.     window.addEventListener('load', addDownloadButtons);
  57.  
  58.     // Run again if the page updates dynamically
  59.     setInterval(addDownloadButtons, 3000);
  60. })();