<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>sss</title>
<script src="html2canvas.js" type="text/javascript" charset="utf-8"></script>
<script src="canvas2image.js" type="text/javascript" charset="utf-8"></script>
<script src="base64.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="capture" style="padding: 10px; background: #f5da55">
<h4 style="color: #000; ">Hello world!</h4>
</div>
<div id="canvass"></div>
<img src="" alt="" id="imgs" />
</body>
<script type="text/javascript">
/*生成canvas图形*/
// 获取内容id
var content = document.getElementById("capture");
// 进行canvas生成
html2canvas(content, {
onrendered: function(canvas) {
//添加属性
canvas.setAttribute('id','thecanvas');
//读取属性值
// var value= canvas.getAttribute('id');
document.getElementById('canvass').innerHTML = '';
document.getElementById('canvass').appendChild(canvas);
var strDataURI = canvas.toDataURL();
document.getElementById('imgs').src = strDataURI;
}
});
</script>
</html>
div转png/jpg格式图片，兼容IE9+及主流浏览器
5星 · 超过95%的资源 需积分: 50 185 浏览量
2018-01-22
14:07:25
上传
评论
收藏 60KB RAR 举报 
div转img图片.rar （4个子文件） 
div转img图片 
index.html 1KB
html2canvas.js 214KB canvas2image.js 60KB base64.js 3KB资源评论
东方之晓2019-01-04还不错，就是不能IE7使用
pony6662021-02-19不错，但是box-shadow不起作用了
