IT干货网

js 实现文件导出、文件下载

xmjava 2022年03月15日 编程设计 183 0

1、通过创建a标签,实现下载功能

function downLoad(content,fileName){ 
        var aEle = document.createElement("a");// 创建a标签 
        // blob = new Blob([content]);  
        aEle.download = fileName;// 设置下载文件的文件名 
        //aEle.href = URL.createObjectUrl(blob); 
        aEle.href = content;// content为后台返回的下载地址 
        aEle.click();// 设置点击事件 
 
} 
let URL ='XXXX' //下载地址 
downLoad(URL ,'test.xlxs')

如果content 非下载地址,而是下载的内容。实现代码微调下即可。

function downLoad(content,fileName){ 
        var aEle = document.createElement("a");// 创建a标签 
        blob = new Blob([content]);  
        aEle.download = fileName;// 设置下载文件的文件名 
        aEle.href = URL.createObjectUrl(blob); 
        aEle.click();// 设置点击事件 
 
} 
downLoad('下载内容123123','test.txt')

2、通过H5 的 download方法

function downFile(content, filename) { 
    var ele = document.createElement('a');// 创建下载链接 
    ele.download = filename;//设置下载的名称 
    ele.style.display = 'none';// 隐藏的可下载链接 
    // 字符内容转变成blob地址 
    var blob = new Blob([content]); 
    ele.href = URL.createObjectURL(blob); 
    // 绑定点击时间 
    document.body.appendChild(ele); 
    ele.click(); 
    // 然后移除 
    document.body.removeChild(ele); 
};

 参考地址:https://www.zhangxinxu.com/wordpress/2017/07/js-text-string-download-as-html-json-file/


评论关闭
IT干货网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!

base64字符串实现下载文件