图片下载器

可以在绝大多数网站提取并批量下载图片。尤其是类似于千库网这种,不能右键保存图片的网站,提取之后,可以右键保存,或者直接下载所有的图片。其他的淘宝、天猫电商图片批量下载,youtube、B站封面下载,等等都可以的。点击右键-tampermonkey-图片下载器,按这个顺序使用。

当前为 2021-01-28 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name 图片下载器
  3. // @namespace http://tampermonkey.net/
  4. // @description 可以在绝大多数网站提取并批量下载图片。尤其是类似于千库网这种,不能右键保存图片的网站,提取之后,可以右键保存,或者直接下载所有的图片。其他的淘宝、天猫电商图片批量下载,youtube、B站封面下载,等等都可以的。点击右键-tampermonkey-图片下载器,按这个顺序使用。
  5. // @version 1.11
  6. // @author 桃源隐叟
  7. // @include *
  8. // @grant GM_openInTab
  9. // @grant GM_download
  10. // @run-at context-menu
  11. // @match *
  12. // @match https://www.bilibili.com/
  13. // @match https://588ku.com/
  14. // @homepageURL https://github.com/taoyuancun123/modifyText/blob/master/modifyText.js
  15. // @supportURL https://gf.qytechs.cn/zh-CN/scripts/419894/feedback
  16. // ==/UserScript==
  17.  
  18. (function () {
  19. 'use strict';
  20.  
  21. try {
  22. document.querySelector(".tyc-image-container").remove();
  23. } catch {
  24.  
  25. }
  26. let imgUrls = [];
  27. let bodyStr = document.body.innerHTML;
  28.  
  29. try {
  30. let imgEles = document.getElementsByTagName("img")
  31.  
  32. for (let i = 0; i < imgEles.length; i++) {
  33. ////console.log(imgEles[i].src);
  34. if (!imgUrls.includes(imgEles[i].src)) {
  35. imgUrls.push(imgEles[i].src);
  36. }
  37.  
  38.  
  39. }
  40.  
  41.  
  42. } catch {
  43. //alert("error");
  44. }
  45.  
  46.  
  47. try {
  48. let imgRegs = bodyStr.match(/(?<=background-image:\s*url\()(\S+)(?=\))/g);
  49.  
  50. for (let i = 0; i < imgRegs.length; i++) {
  51. ////console.log(imgRegs[i]);
  52. if (!imgUrls.includes(imgRegs[i].replace(/&quot;/g, ""))) {
  53. imgUrls.push(imgRegs[i].replace(/&quot;/g, ""));
  54. }
  55.  
  56. }
  57. } catch {
  58. //alert("error");
  59. }
  60.  
  61.  
  62. let imgContainer = `
  63. <div class="tyc-image-container" style="position:fixed;
  64. top:0px;right:0px;width:50vw;z-index:2147483645;
  65. background-color: #dedede;
  66. border: 1px solid #aaa;
  67. overflow:scroll;height:100%;
  68. ">
  69. <div class="control-section" style="width:46vw;z-index:2147483646;
  70. position:fixed;right:30px;
  71. top:0px;display:block;
  72. height:40px;line-height:40px;
  73. background:#eee;border:1px solid #aaa;border-radius:10px;">
  74. <input class="select-all" type="checkbox" name="select-all" value="select-all">全选
  75. <button class="btn-download" style="border:1px solid #aaa;border-radius:5px;
  76. height:32px;line-height:32px;
  77. margin:0px;padding:0 5px;
  78. ">download</button>
  79. <button class="btn-close" style="font-size:20px;position:absolute;
  80. right:30px;top:4px;
  81. height:32px;line-height:32px;
  82. margin:0px;
  83. border-radius:10px;border:1px solid #aaa;
  84. width:30px;">X</button>
  85. </div>
  86. <div class="tyc-image-wrapper" style="margin-top:42px;display:flex;justify-content:center;
  87. align-items:center;flex-wrap:wrap;">
  88. </div>
  89. </div>
  90. `
  91.  
  92. let showBigImage = `
  93. <div class="show-big-image" style="position:fixed;left:30%;top:30%;z-index:2147483647;">
  94. </div>
  95. `
  96.  
  97. document.body.insertAdjacentHTML("afterbegin", imgContainer);
  98.  
  99. document.querySelector(".btn-close").onclick = (e) => {
  100. document.querySelector(".tyc-image-container").remove();
  101. }
  102.  
  103. document.querySelector(".btn-download").onclick = (e) => {
  104. if (document.querySelector(".select-all").checked) {
  105. imgUrls.forEach((img, index) => {
  106. GM_download(img, `pic-${index}`);
  107. });
  108. } else {
  109. alert("请勾选全选,下载全部,或者手动在图片上右键另存为指定图片");
  110. }
  111. }
  112.  
  113.  
  114. imgUrls.forEach((img, index) => {
  115. let insertImg = `<div class="tyc-img-item-container-${index}" style="text-align:center;font-size:0px;
  116. margin:5px;border:1px solid #99d;border-radius:3px;
  117. ">
  118. <img class="tyc-image-preview" src="${img}"/ style="width:auto;height:200px;"></div>`
  119. document.querySelector(".tyc-image-wrapper").insertAdjacentHTML("beforeend", insertImg);
  120. let naturalW = document.querySelector(`.tyc-img-item-container-${index} .tyc-image-preview`).naturalWidth;
  121. let naturalH = document.querySelector(`.tyc-img-item-container-${index} .tyc-image-preview`).naturalHeight;
  122.  
  123. let imgInfoContainer=`
  124. <div style="font-size:0px;background-color:rgba(100,100,100,0.6);height:30px;position:relative;">
  125.  
  126.  
  127. </div>
  128. `;
  129.  
  130. let thisImgContainer=document.querySelector(`.tyc-img-item-container-${index}`);
  131. let imgContainerWidth=thisImgContainer.getBoundingClientRect().width;
  132. let imgInfo = `
  133. <span style="font-size:16px;position:absolute;left:calc(50% - 80px);top:7px;">${naturalW}X${naturalH}</span>
  134. `;
  135.  
  136. let downAndFullBtn=`
  137. <span style="position:absolute;right:calc(50% - 30px);top:2px;border:1px solid #333;
  138. width:26px;height:26px;border-radius:20px;" class="preview-img">
  139. <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrows-fullscreen" viewBox="0 0 16 16" style="position:absolute;top:5px;right:5px;">
  140. <path fill-rule="evenodd" d="M5.828 10.172a.5.5 0 0 0-.707 0l-4.096 4.096V11.5a.5.5 0 0 0-1 0v3.975a.5.5 0 0 0 .5.5H4.5a.5.5 0 0 0 0-1H1.732l4.096-4.096a.5.5 0 0 0 0-.707zm4.344 0a.5.5 0 0 1 .707 0l4.096 4.096V11.5a.5.5 0 1 1 1 0v3.975a.5.5 0 0 1-.5.5H11.5a.5.5 0 0 1 0-1h2.768l-4.096-4.096a.5.5 0 0 1 0-.707zm0-4.344a.5.5 0 0 0 .707 0l4.096-4.096V4.5a.5.5 0 1 0 1 0V.525a.5.5 0 0 0-.5-.5H11.5a.5.5 0 0 0 0 1h2.768l-4.096 4.096a.5.5 0 0 0 0 .707zm-4.344 0a.5.5 0 0 1-.707 0L1.025 1.732V4.5a.5.5 0 0 1-1 0V.525a.5.5 0 0 1 .5-.5H4.5a.5.5 0 0 1 0 1H1.732l4.096 4.096a.5.5 0 0 1 0 .707z"/>
  141. </svg>
  142. </span>
  143. <span style="position:absolute;right:calc(50% - 60px);top:2px;border:1px solid #333;
  144. width:26px;height:26px;border-radius:20px;
  145. " class="download-direct">
  146. <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-download" viewBox="0 0 16 16" style="position:absolute;top:5px;right:5px;">
  147. <path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"/>
  148. <path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z"/>
  149. </svg>
  150. </span>
  151.  
  152. `;
  153.  
  154. thisImgContainer.insertAdjacentHTML("beforeend", imgInfoContainer);
  155.  
  156. let thisImgInfoContainer=thisImgContainer.querySelector("div");
  157.  
  158.  
  159. thisImgContainer.getBoundingClientRect().width > 120 && (thisImgInfoContainer.insertAdjacentHTML("beforeend", imgInfo),
  160. thisImgInfoContainer.insertAdjacentHTML("beforeend", downAndFullBtn))
  161. ////console.log(img);
  162. });
  163.  
  164. document.body.onclick = (e) => {
  165. //console.log(e);
  166. if ((e.target.nodeName=="IMG" && e.target.className==="tyc-image-preview")||e.target.classList[1] == "bi-arrows-fullscreen" ||e.path.find(isPreview) != undefined) {
  167. let imgContainer = e.path.find(
  168.  
  169. (ele) => {
  170. try {
  171. //console.log(ele);
  172. return ele.className.includes("tyc-img-item-container");
  173. }
  174. catch {
  175.  
  176. }
  177.  
  178. }
  179. )
  180. let path = imgContainer.getElementsByTagName("img")[0].src;
  181.  
  182. try {
  183. let container = document.querySelector(".show-big-image");
  184. if (container.getElementsByTagName("img")[0].src === path) {
  185. container.remove();
  186. return;
  187. } else {
  188. container.remove();
  189. }
  190. }
  191. catch {
  192.  
  193. }
  194. document.body.insertAdjacentHTML("beforeend", showBigImage);
  195.  
  196. let showItem = `<img src="${path}"/>`
  197.  
  198. document.querySelector(".show-big-image").insertAdjacentHTML("beforeend", showItem);
  199.  
  200. let tempImg = document.querySelector(".show-big-image img");
  201.  
  202. let dWidth = (window.innerWidth - tempImg.width) / 2;
  203. let dHeight = (window.innerHeight - tempImg.height) / 2;
  204.  
  205. document.querySelector(".show-big-image").style.left = dWidth + "px";
  206. document.querySelector(".show-big-image").style.top = dHeight + "px";
  207. } else if (e.target.parentElement.className === "show-big-image") {
  208. try {
  209. document.querySelector(".show-big-image").remove();
  210. }
  211. catch
  212. {
  213.  
  214. }
  215.  
  216. } else if (e.target.classList[1] == "bi-download" || e.path.find(isDownload) != undefined) {
  217. let imgContainer = e.path.find(
  218.  
  219. (ele) => {
  220. try {
  221. //console.log(ele);
  222. return ele.className.includes("tyc-img-item-container");
  223. }
  224. catch {
  225.  
  226. }
  227.  
  228. }
  229. )
  230. let path = imgContainer.getElementsByTagName("img")[0].src;
  231. var filename;
  232. if (path.indexOf("/") > 0)//如果包含有"/"号 从最后一个"/"号+1的位置开始截取字符串
  233. {
  234. filename = path.substring(path.lastIndexOf("/") + 1, path.lastIndexOf("."));
  235. }
  236. else {
  237. filename = path;
  238. }
  239. //console.log("download start" + path + " " + filename);
  240. GM_download(path, "pic");
  241. }
  242. }
  243.  
  244. function isDownload(ele) {
  245. return ele.className == "download-direct";
  246. }
  247.  
  248. function isPreview(ele) {
  249. return ele.className == "preview-img";
  250. }
  251. })();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址