JAVAScript把把文件数据保存到本地（下载文件）

最新推荐文章于 2024-07-25 15:02:55 发布

@Hmily@

最新推荐文章于 2024-07-25 15:02:55 发布

阅读量9k

点赞数 1

分类专栏： JS 文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/wqh0830/article/details/125020929

版权

JS 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

// <input type="file" name="file" id="file"/>
let fileEl = document.getElementById("file")
fileEl.onchange = function () {
    let file = fileEl.files[0]
    /*
    把文件转成url
    createObjectURL()参数可以传blob或者file
     */
    let url = URL.createObjectURL(file)
    let a = document.createElement("a")
    /*
    a.innerHTML = "下载文件"
    或者 a.innerText = "下载文件"
    该属性可有可无，如果页面需要显示a标签，则保留属性；
    反之则无需保留该属性
     */
    // a.innerHTML = "下载文件"
    a.style.display = "none"
    a.href = url
    /*
    这个属性为关键属性,如果不添加download属性，
    则会直接在浏览器打开该文件，对于浏览器不能打
    开的文件会显示乱码，比如压缩包
     */
    a.download = file.name
    document.body.appendChild(a)


    //为a标签赋予点击事件并点击，如果是手动点击，则无需赋予事件
    let evt = document.createEvent("MouseEvents");
    evt.initEvent("click", true, true);
    a.dispatchEvent(evt);
    //下载完成之后删除a标签
    document.body.removeChild(a);
}