「JavaScript」- 从页面中,提取图片 @20210215

批量下载网页图片:JavaScript 解决方案
这篇笔记介绍了如何使用JavaScript在浏览器控制台生成wget命令,批量下载网页中的图片。首先在控制台运行特定代码,该代码遍历所有包含http链接的图片,并为每张图片生成wget下载链接。然后在Shell环境中执行生成的命令即可下载图片。这种方法适用于需要快速下载大量图片的场景。
部署运行你感兴趣的模型镜像

问题描述

在页面中,包含我们需要的图片。

但是,图片数量巨多,我们无法依次右键保存。

该笔记将记录:如何批量下载网页中的图片。

解决方案

问题的解决方案有很多,我们无法一一列举,本文仅仅记录我们采用的方法。

在浏览器控制台中,执行如下 JavaScript 代码:

list = ""
$x("//img[contains(@data-src, 'http')]").forEach(function (item, idx) {
    imageType = item.getAttribute("data-type")
    imageLink = item.getAttribute("data-src")
    list = list + "wget -O " + idx + "." + imageType + " " + imageLink + "\n"
})
console.log(list)

执行如上代码,将生成 wget 下载链接,类似如下:

...
wget -O 81.jpeg https://mmbiz.qpic.cn/sz_mmbiz_jpg/pUm6Hxkd435PzG5tgPApm9hic9aNPXP5J2cDGyQ07IctgudX4WjiaicuOzcP4yHsDGI8Z7MUY2D8iajCeMG0DJM5pw/640?wx_fmt=jpeg
wget -O 82.jpeg https://mmbiz.qpic.cn/sz_mmbiz_jpg/pUm6Hxkd435PzG5tgPApm9hic9aNPXP5JQCRX1pjZj9l8xNrWm9dNSPmicmTsiciaMu2YZewmfjkH2HiaQmCpibdjPHA/640?wx_fmt=jpeg
wget -O 83.jpeg https://mmbiz.qpic.cn/sz_mmbiz_jpg/pUm6Hxkd435PzG5tgPApm9hic9aNPXP5J8g3ZTovp4joJ7QbqP92sFhko2I8jaBicEcictpdvsA4wMoEbafqktbvQ/640?wx_fmt=jpeg
wget -O 84.png https://mmbiz.qpic.cn/sz_mmbiz_png/pUm6Hxkd435PzG5tgPApm9hic9aNPXP5JOd2slUKZCzUTu90BhfU7aTiagKrCvTRc2rA8Khibibj6ch0ibXHfRK8ewg/640?wx_fmt=png
wget -O 85.jpeg https://mmbiz.qpic.cn/sz_mmbiz_jpg/pUm6Hxkd435PzG5tgPApm9hic9aNPXP5Jwq2goiap3OGnMxant5CUTGXtT1Dcf8cSQ8NNU1BbnJYeSXy2yeSwGsw/640?wx_fmt=jpeg
wget -O 86.jpeg https://mmbiz.qpic.cn/mmbiz_jpg/K0TMNq37VN0jeHsTlPKiaucY0XZLxgMcicNcr0xBRcIEvZKbuicxLib9YnaLWZ6UEyRG7XDV0OZgjQ16sBxovZiap5g/640?wx_fmt=jpeg
...

最后,在 Shell 中,执行如上命令下载图片。

相关文章

「JavaScript」- 从页面中,提取下载链接(多用于视频网站)
「jQuery」- 显示自动隐藏的消息提示框
「JavaScript」- 选择全部的选择框

参考文献

JavaScript Array forEach() Method

您可能感兴趣的与本文相关的镜像

Qwen-Image

Qwen-Image

图片生成
Qwen

Qwen-Image是阿里云通义千问团队于2025年8月发布的亿参数图像生成基础模型,其最大亮点是强大的复杂文本渲染和精确图像编辑能力,能够生成包含多行、段落级中英文文本的高保真图像

评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值