js 动态创建a href 循环下载文件只能下载10个或者固定数

在web前端项目中，很多地方的下载单张图片/文件都可以用<a href="/images/logo.png" download="文件名">来下载指定文件

遇到的问题：

在下载多个文件的时候 使用for 循环来触发 a href download (此批量下载方法当然不推荐 很lowB 也体验不好 只是偶尔发现此问题 )

//for循环来触发a href 下载文件
for(let i=0;i<=100;i++){
   // 获取要下载的图片dom
   var img = document.getElementsByClassName('qrcode_canvas')[i]; 
   //获取地址
   var url = img.src;
   var a = document.createElement('a');
   //模拟点击
   var event = new MouseEvent('click');   
   a.download="xxxxx.png";
   a.dispatchEvent(event);    
}

image.gif

1.此方法在mac的电脑上的chrome 上，不论怎么操作，不管是mac笔记本 8GB16GB运行内存的，还是iMac 一体机16GB内存的 都只能下载 10 张（浏览器也没有报任何错误的log信息 显然不是内存问题）

2.而在window 系统上的chrome 上却没有发现限制，超过10张是可以正常下载的

目前并没有找到具体问题的原因，只能是在现在单个文件时候 可以通过a href download 来下载，下载多个文件的时候用三方插件（主要用到 jszip 和 file-saver 直接下载多个文件的zip压缩文件）

npm install jszip --save
npm install file-saver --save

image.gif

拓展

https://blog.csdn.net/wzp6010625/article/details/100918051

目前此现象只发生在mac OS系统上