Html2Canvas中的HTML字符串
[英]HTML String in Html2Canvas
問題描述
我們如何將有效的HTML字符串傳遞給html2canvas？
例如
var html = "<html><head></head><body><p>HI</p></body></html>
在http://html2canvas.hertzen.com/screenshots.html上完成它的方式
Html2canvas真的很棒，除了文檔記錄很差外。
2 個解決方案
解決方案1
9 2013-04-20 10:12:12
通常html2canvas呈現DOM元素而不是html代碼。 但是你可以創建一個臨時的iFrame，讓你的html在iFrame中渲染，然后將生成的DOM提供給html2canvas。
你可以在這個jsfiddle中找到一個例子來玩，或者為了你的方便：
var html_string = "<html><head></head><body><p>HI</p></body></html>";
var iframe=document.createElement('iframe');
document.body.appendChild(iframe);
setTimeout(function(){
var iframedoc=iframe.contentDocument||iframe.contentWindow.document;
iframedoc.body.innerHTML=html_string;
html2canvas(iframedoc.body, {
onrendered: function(canvas) {
document.body.appendChild(canvas);
document.body.removeChild(iframe);
}
});
}, 10);
解決方案2
6 已采納 2013-04-20 10:20:03
你可以這樣做
var iframe=document.createElement('iframe');
$('body').append($(iframe));
setTimeout(function(){
var iframedoc=iframe.contentDocument||iframe.contentWindow.document;
$('body',$(iframedoc)).html('<html><head></head><body><p>HI</p></body></html>');
html2canvas(iframedoc.body, {
onrendered: function(canvas) {
$('body',$(document)).append(canvas);
$('body',$(document)).remove(iframe);
}
});
}, 10);
在這里查看整個代碼：
DEMO
html2canvas基礎
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.