下載下傳，下載下傳圖檔，下載下傳資源

1、js動态建立标記下載下傳圖檔或檔案

注意：該方法如果下載下傳url和通路域名不同，也會導緻某些浏覽器解析并打開圖檔，加上target="_blank"的好處，不會在原先頁面上打開圖檔。

dom元素可以通過 .文法為其添加（标簽上的屬性）

const handleDownload = (file) => {
      const url = file.url; // 圖檔位址
      let a = document.createElement("a"); // 建立一個a節點插入的document
      const event = new MouseEvent("click"); // 模拟滑鼠click點選事件
      a.download = file.name; // 設定a節點的download屬性值
      a.target = "_blank"; // 打開新視窗下載下傳圖檔
      a.href = url; // 将圖檔的src指派給a節點的href
      a.dispatchEvent(event); // 觸發滑鼠點選事件
      a = null; // 防止記憶體洩露
    };      

function downloadImg(){
    const url = 'http://www.a.com/pic.jpg';          // 圖檔位址
    let a = document.createElement('a');          // 建立一個a節點插入的document
    const event = new MouseEvent('click')           // 模拟滑鼠click點選事件
    a.download = '圖檔名字'                        // 設定a節點的download屬性值
    a.target = '_blank'                           // 打開新視窗下載下傳圖檔
    a.href = url;                                 // 将圖檔的src指派給a節點的href
    a.dispatchEvent(event)                        // 觸發滑鼠點選事件
    a = null // 防止記憶體洩露
 }      

2、利用window.open()下載下傳檔案

注意：适用于下載下傳一些壓縮包、word檔案等浏覽器無法解析的檔案

window.open('http://www.a.com/pic.jpg', '_blank')      

3、解決圖檔下載下傳問題的終極方案

檔案過大的情況下，響應會很慢

function downloadIamge(imgsrc, name) {
  const x = new XMLHttpRequest()
  x.open('GET', imgsrc, true)
  x.responseType = 'blob'
  x.onload = function(e) {
    var url = window.URL.createObjectURL(x.response)
    var a = document.createElement('a')
    a.href = url
    a.download = name
    a.click()
  }
  x.send()
}      

<a href="down.jpg" download="name" target="_blank">
</a>