如何將多個div保存為圖像？

Question

我正在嘗試為用戶建立一個界面，以便他可以選擇或選擇模型的彩色眼睛，皮膚等。 我真的在使用div和CSS。 我正在使用Ajax將圖像加載到div 。

我的問題是，我需要向用戶提供一個選項，以便他可以將圖像另存為JPEG或PNG文件。

環顧四周，我在Stack Overflow上發現了HTML5畫布的內容，但它與Internet Explorer不兼容，

• 在JavaScript（GIF / PNG）中創建DIV的圖像
• 如何在div包含一個或多個HTML5 canvas元素的客戶端將div保存為圖像？

我需要幫助來查找與所有瀏覽器兼容的內容。

我還找到了以下JavaScript代碼：

button = document.createElement("img");
button.src = "http://example.com/livechart.gif?interval=15"

但是我對createElement方法了解不多。

我知道CSS，但是JavaScript是我所不了解的。

Answer 1

您不能在瀏覽器上執行此操作，而必須在服務器上執行此操作。

請參閱： 將網頁轉換為圖像

Answer 2

我相信您可以使用HTML canvas和一些JavaScript來做到這一點： Canvas2Image：將Canvas數據保存到圖像文件 。

Answer 3

您要獲取瀏覽器的屏幕截圖嗎？ 好了，您可以嘗試多種方式，但是所有方式都將特定於瀏覽器。 最可靠的方法就是告訴用戶使用OS進行屏幕截圖。 在Mac上是Command-Shift-4，然后是空格； 我認為是PC上的ALT-PrtScr。