通過Html2canvas實現截屏

插件描述：通過JS就能截屏，這是Html2canvas為用戶提供的一個便捷的神器，通過對DOM元素的信息提取渲染頁面。

使用場景： 1. 實現對當前頁面截屏，保存為圖片

2. 對當前頁面顯示的內容進行截屏後，生成縮略圖，用戶導航欄的顯示。

工作原理

Html2canvas載入後將會瀏覽頁面上的所有元素，集合所有頁面元素的信息，然後用戶就可以通過Html2canvas把整個頁面截圖下來。

換句話說，Html2canvas不是實際上的截圖，而是通過從DOM讀取的足夠信息去建立一個頁面的展示鏡像。

這就會導致Html2canvas只會渲染它認識的正確的DOM元素屬性，還有很多CSS屬性是不會生效的，也就渲染不出來了。

限制

所有的圖片都需要在當前域下，這樣Html2canvas才能不通過代理去讀取到。同樣地，如果你的頁面上有其他的被跨域內容污染的canvas元素，html2canvas將不能準確渲染下來。

html2canvas不會渲染插件內容：Flash，Java組件，和iframe頁面的內容。

所以，用戶需要在特定的情況下來使用該插件，便能發揮很大的便利。

使用方法

帶有回掉函數的：

可用參數

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！