JS实现下载文件
最近需要下载一些视频,数量不算多,百十个,动态加载比较多,写爬虫比较麻烦,想想不如直接做个书签JS直接点点鼠标下载了。
第一个:直接打开链接
javascript:(function() {var uri_enc = document.getElementsByClassName("xxx")[0].src;window.open(uri_enc);}) ();
但是这样文件名是默认文件名,
于是第二个:创建一个a标签,然后点击。
javascript:(function()
{var url = document.getElementsByClassName("url")[0].src;
const a = document.createElement("a");
a.href = url;
a.download = document.getElementsByClassName("name")[0].innerText.split(":",)[1];
a.name=document.getElementsByClassName("name")[0].innerText.split(":",)[1];
a.click();
a.remove();
})();
但是对于PDF、视频是无效的,浏览器会直接浏览而不是默认下载。
想想还是改进下第一个方案。
从页面提取想要的字符串做文件名
第三版:
javascript:(function() {
var elm = document.createElement('textarea');
var str= document.getElementsByClassName("name")[0].innerText.split(":",)[1];
elm.value = str;
document.body.appendChild(elm);
elm.select();
document.execCommand('copy');
document.body.removeChild(elm);
var uri_enc = document.getElementsByClassName("url")[0].src;
window.open(uri_enc);
}) ();
但是要多操作两次键盘,于是想通过获取blob来实现下载视频
第四版:
javascript:(function (){
var url=document.getElementsByClassName("url")[0].src;
var name=document.getElementsByClassName("name")[0].innerText.split(":",)[1];
fetch(url)
.then(res => res.blob())
.then(blob => {
const a = document.createElement("a");
const objectUrl = window.URL.createObjectURL(blob);
a.download = name;
a.href = objectUrl;
a.click();
window.URL.revokeObjectURL(objectUrl);
a.remove();
})
}) ();
但是实际使用效果有些差,fetch要全部缓存下来才显示下载窗口。等待时间过长了,不如用第三版多操作两下,可以达到类似多线程的效果。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 记一次.NET内存居高不下排查解决与启示