前端哥这次分享的是前端通过js下载文件的代码示例，主要是提供给访问者方便的下载形式，减少了访问一些列操作，比方说下载图片的时候，要右键另存为，下载txt的时候却是在线访问需要复制或者通过浏览器的下载器才能下载。
但是需要注意的是，下载远程文件需要开启跨域和允许权限问题
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>前端通过js下载文件实例 - 前端哥</title></head><body> <button onClick="download('https://www.qianduange.cn/upload/slideImage/1673662042.jpg','前端通过js下载文件实例 - 前端哥')">标签下载</button> <script> function downloadFile(content, filename) { var a = document.createElement('a') var blob = new Blob([content]) var url = window.URL.createObjectURL(blob) a.href = url a.download = filename a.click() window.URL.revokeObjectURL(url) } function download(url,name) { ajax(url, function(xhr) { var filename = name url.replace(/(.*\.)/, '') // 自定义文件名 后缀 downloadFile(xhr.response, filename) }, { responseType: 'blob' }) } function ajax(url, callback, options) { window.URL = window.URL || window.webkitURL var xhr = new XMLHttpRequest() xhr.open('get', url, true) if (options.responseType) { xhr.responseType = options.responseType } xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { callback(xhr) } } xhr.send() } </script></body></html>
