js做文件下载（js生成文件并下载）

发布时间：2023-12-08

js做文件下载（js生成文件并下载）

更新：<time datetime="2022-11-08 13:15">2022-11-08 13:15</time>

本文目录一览：

1、前端js实现数据写csv文件，并下载
2、怎样用JS实现文件下载功能，求函数，代码
3、如何用js实现点击按钮下载文件
4、如何用JavaScript实现文件下载？

前端js实现数据写csv文件，并下载

var data = ["1,2,3\n","4,5,6"] // 每一行数据为一个字符串，字符串用“,”隔开，并且在每一行加上换行符
var blob = new Blob(data, {type:"text/csv,charset=UTF-8"})
var csvUrl = URL.createObjectURL(blob)
var aEle = document.createElement("a")
aEle.download = "data.csv" //文件名随意
aEle.href = csvUrl
aEle.click()

怎样用JS实现文件下载功能，求函数，代码

其实很简单, 在这个方法里面, 只要使用页面跳转, 将url指向文件地址, IE就会实现下载了。
例如下载Upload 文件夹下的XX.doc，注意路径要对：

function download() {
    location.href="../Upload/XX.doc";
}

如何用js实现点击按钮下载文件

在按钮上写属性 onclick="函数名()"，作用是绑定click事件。
例如：

<input type="button" onclick="Click()" value="Download" />

然后在脚本处写上对应的函数即可，在函数中跳转到相应的文件路径就行：

function Click() {
    window.location.href="文件的url地址";
}

如何用JavaScript实现文件下载？

参考如下：

使用JS实现下载.jpg、.doc、.txt、.rar、.zip等文件的方法

// 使用JS实现下载.jpg、.doc、.txt、.rar、.zip等文件的方法(参数 imgOrURL 为需要下载的图片的URL地址)
// 使用该方法实现下载压缩文件时会有网页错误信息提示
// .doc、.rar、.zip 文件可以直接通过文件地址下载，
// 如： <a href="../Images/test.doc">点击下载文件</a> <a href="../Images/test.zip">点击下载文件</a>
function saveImageAs(imgOrURL) {
    if (typeof imgOrURL == 'object')
        imgOrURL = imgOrURL.src;
    window.win = open(imgOrURL);
    setTimeout('win.document.execCommand("SaveAs")', 500);
}
// 使用JS实现下载.txt、.doc、.txt、.rar、.zip等文件的方法(参数 fileURL 为需要下载的图片的URL地址)
// 使用该方法实现下载压缩文件时不会有网页错误信息，但是不能使用该方法下载.jpg图片文件
// .doc、.rar、.zip 文件可以直接通过文件地址下载，
// 如： <a href="../Images/test.doc">点击下载文件</a> <a href="../Images/test.zip">点击下载文件</a>
function savetxt(fileURL) {
    var fileURL = window.open(fileURL, "_blank", "height=0,width=0,toolbar=no,menubar=no,scrollbars=no,resizable=on,location=no,status=no");
    fileURL.document.execCommand("SaveAs");
    fileURL.window.close();
    fileURL.close();
}
// 功能类似savetxt方法，但是下载时初始文件名为code.txt，而不是跟目标文件名相同
function svcode(obj) {
    var winname = window.open('', '_blank', 'height=1,width=1,top=200,left=300');
    winname.document.open('text/html', 'replace');
    winname.document.writeln(obj.value);
    winname.document.execCommand('saveas','','code.txt');
    winname.close();
}

示例调用

<a href="javascript: void 0" onclick="savetxt('../Images/test.txt'); return false">点击下载文件</a>
<br /><br />
<a href="javascript:savetxt('../Images/test.txt')">点击下载文件</a>
<br /><br />
<!-- .doc、.rar、.zip 文件可以直接通过文件所在地址下载 -->
<a href="../Images/test.doc">点击下载文件</a>
<br /><br />
<a href="../Images/test.zip">点击下载文件</a>
推荐文章