使用JS代码实现点击按钮下载文件

使用JS代码实现点击按钮下载文件需要用到Web API中的Blob和URL两个对象，以下是完整的攻略：

1. 创建Blob对象

Blob对象是二进制大型对象，可以用于存储二进制数据或文本数据。我们可以使用Blob对象作为文件的内容，再利用URL对象生成一个下载链接。

代码示例：

let content = 'Hello, World!'
let blob = new Blob([content], { type: 'text/plain' })

上述代码创建了一个内容为'Hello, World!'的Blob对象，并设置了类型为'text/plain'。

1. 生成下载链接

接下来，我们需要利用URL对象生成一个可供下载的链接。

代码示例：

let url = URL.createObjectURL(blob)

上述代码使用URL.createObjectURL方法，创建一个Blob对象的URL，并将其赋值给url变量。因此，我们可以将这个url链接提供给用户下载。

1. 创建下载按钮

我们需要在页面上创建一个下载按钮，当用户点击按钮时，我们需要执行下载操作。

代码示例：

<button id="download-btn">Download</button>

上述代码创建了一个ID为‘download-btn’的下载按钮。

1. 绑定点击事件

最后一步，我们需要在下载按钮上绑定点击事件，当用户点击按钮时，执行下载操作。

代码示例：

document.getElementById('download-btn').addEventListener('click', function () {
  let a = document.createElement('a')
  a.href = url
  a.download = 'hello.txt'
  document.body.appendChild(a)
  a.click()
  document.body.removeChild(a)
})

上述代码对下载按钮绑定了一个click事件。当用户点击按钮时，创建一个'a'标签，将生成的URL链接赋值给其href属性，并设置下载文件的文件名，将这个'a'标签添加到页面中，执行a.click()方法触发下载操作，最后将这个'a'标签从页面中删除。

有了这个简单而强大的脚本，你可以实现网站用户下载文件的功能。