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要全部缓存下来才显示下载窗口。等待时间过长了，不如用第三版多操作两下，可以达到类似多线程的效果。