首页 > 其他分享 >js根据文件链接下载文件

js根据文件链接下载文件

时间:2023-02-13 16:35:54浏览次数:40  
标签:body 文件 js link iframe document 链接 下载

通过iframe下载

  // 移除旧的节点
  const oldNode = document.querySelector("#g-download-iframe")
  if (oldNode) {
    document.body.removeChild(document.querySelector("#g-download-iframe"))
  }
  // 生成新节点,进行下载
  const iframe = document.createElement("iframe")
  iframe.style.display = "none"
  iframe.id = "g-download-iframe"
  iframe.src = url
  document.body.appendChild(iframe)

通过a标签下载

  // 创建a标签
  const link = document.createElement("a")
  link.setAttribute("href", url)
  document.body.appendChild(link)
  // 模拟手动点击a标签下载文件
  link.click();
  setTimeout(() => {
    // 删除DOM节点
    document.body.removeChild(link)
  }, 1000);

通过window.open下载

  window.open(url, "_blank");

注意: 通过window.open方式打开链接时, 如果浏览器支持, 会在浏览器中打开该文件

标签:body,文件,js,link,iframe,document,链接,下载
From: https://www.cnblogs.com/rainslight/p/16996904.html

相关文章

  • 将Markdown文件转换成PDF文件
    1.下载并安装1.1vscode  首先需要说明的是vscode分为System和User两种版本。对于完成该任务来说,并没有太大区别。这里提供一个windows64位的User版本的下载地址:https:......
  • ethers.js 添加区块链网络节点
    <div@click="add">add</div> import{BigNumber}from"ethers"; constobj={chainId:'97',blockBrowseUrl:'https://testnet.bscscan.com',......
  • 【VUE】 文件预览
    【VUE】文件预览上传前预览word文档:docx、doc核心代码import{renderAsync}from"docx-preview";/***渲染docx*@parambuffer*/docxRender(buffer){l......
  • ChatGPT 使用教程(含国内相关产品链接)
    ChatGPT链接:https://chat.openai.com/auth/login在使用之前请准备以下材料:相关工具(若没有,可访问以ChatGPT为技术引擎的国内产品,查看附录一)可接收短信的海外手机号(若......
  • Windows11如何预览STL文件缩略图【已解决】
    最近由于要处理大量的3D打印模型,但是STL文件得一个个点开才能看,如果只是十来个文件还好说,当遇到上千个3D模型时简直让人抓狂~!上网搜了一下,网友推荐了个工具【STL-Thumb】,......
  • ASP.NET Core - .NET 6 的入口文件
    自从.NET6开始,微软对应用的入口文件进行了调整,移除了Main方法和Startup文件,使用顶级语句的写法,将应用初始化的相关配置和操作全部集中在Program.cs文件中,如下:var......
  • vue文件中.env xxx 文件的作用
    .env文件配置Vue项目中,.env文件是运行项目时的环境配置文件。但是在实际开发过程中,有本地开发环境、测试环境、生产环境等,不同环境对应的配置会不一样。因此,需要通过不......
  • shell逐行读取文件的方法
    1、while循环functionwhile_read_LINE(){whilereadLINEdoecho$LINEdone<$FILENAME}1.2.3.4.5.6.2、重定向法;管道法functionWhile_read_LINE(){cat$......
  • jstack排查cpu占用高的步骤
    通过jstack排查cpu占用高的问题1.通过top命令找到cpu占用高的应用程序进程2.通过top-H-ppid查看该应用中占用CPU高的线程。3.通过printf"%x\n"pid将线程高的线程......
  • JSP内置对象
    4.JSP隐式对象4.1什么是隐式对象:在jsp页面里面,jsp提供了一些对象,不用咱们自己创建,可以直接使用的对象jsp常见的九大隐式对象:request:HttpServletRequest,请求对象,它同时也......