html图像链接提取
只针对 HTML 里的 <img> 标签:取出 src,并把 srcset 按逗号拆成全部候选地址(丢掉 2x / 640w 描述符),可选带 alt 文本、读取 data-src 懒加载地址与去重。
浏览器本地运行所有计算都在你的浏览器里完成,数据不会离开本机。
HTML 源码
图片链接
一行一条,可直接复制。
粘贴 HTML 后即可提取图片链接
img 标签: 0 · 链接: 0 · 去重后: 0 · 来自 srcset: 0
这个工具能做什么
- 检查响应式图片的 srcset 是否漏掉了某个倍率,或是否还在引用旧域名。
- 把页面里的图片地址导出来做批量下载或迁移前的清单核对。
- 配合 data-src 选项,核对懒加载图片在脚本执行前到底指向哪些占位图。
示例
输入
<img src="a.png" srcset="a.png 1x, big.png 2x" alt="封面"> <img src='b.jpg' alt='b'>
输出
a.png a.png big.png b.jpg
srcset 里的每个候选都会被拆出来,2x 之类的描述符会被丢掉。
常见问题
srcset 里的 2x、640w 描述符怎么处理?
会被丢掉,只保留地址。a.png 1x, big.png 2x 会输出两条:a.png 和 big.png,导出的列表可以直接用来下载或比对。
为什么同一个地址出现两次?
因为它在 src 和 srcset 里都出现了。勾选「按链接去重」即可只保留一条;默认不去重是为了让你看清每个属性各自引用了什么。
懒加载图片的地址在哪?
通常在 data-src / data-original 这类属性里,src 只是占位图。勾选「提取 data-src」就会把 data-src 一起输出。
能处理不闭合的 <img> 吗?
可以。img 本来就是空元素,解析器读到 > 就结束,<img src=x> 与 <img src="x" /> 效果相同。
关键词:img 提取srcset 提取html 图片img src懒加载图片data-src响应式图片image src extractor