使用場景
發生拖動時，瀏覽器會基於元素自動生成半透明圖。但是業務可能需要修改樣式/圖的透明度，這時候就需要自定義樣式
api
查找 MDN 的 api 后可以發現，DataTransfer.setDragImage() 可以修改拖拽圖片，但是介紹說是 img 或者 canvas
圖像通常是一個 <image> 元素，但也可以是<canvas> 或任何其他圖像元素
經實驗，實際上該 api 可以用任意元素
使用虛擬 DOM
雖然實驗是可以用任意元素，但如果使用虛擬 DOM 會發現拖拽圖片是無效的，因為規范規定
Otherwise, image should be a visible node and the drag image will be created from this.
所以使用虛擬 DOM 必須需要插入 DOM 樹中，並在瀏覽器中可見
但是大部分情況下我們並不需要顯示該虛擬 DOM，於是需要方案可以隱藏該 DOM，但是對瀏覽器可見
經試驗，可以設置元素樣式為
position: absolute;
left: -100px; /* 或者 top */
此時，該元素對用戶不可見，但是對瀏覽器可見
ps. 虛擬 DOM 的插入和移除可以分別放在 dragstart 和 dragend
參考鏈接
Setting a custom ghost image when using HTML5 drag and drop
DataTransfer.setDragImage()