Div转base64格式图片
时间: 2023-10-31 16:07:36 浏览: 143
html2canvas网页截图自行工具接口
Div转base64格式图片的方法如下:
1. 首先,需要获取到该div的DOM节点。
2. 使用HTMLCanvasElement的toDataURL()方法将该节点转换为base64格式的图片。
3. 将转换后的base64格式图片赋值给img标签的src属性即可显示图片。
代码示例:
```
// 获取div节点
var div = document.getElementById('myDiv');
// 创建canvas元素
var canvas = document.createElement('canvas');
// 设置canvas的宽高
canvas.width = div.offsetWidth;
canvas.height = div.offsetHeight;
// 获取canvas的2D上下文
var context = canvas.getContext('2d');
// 将div节点绘制到canvas上
context.drawImage(div, 0, 0, canvas.width, canvas.height);
// 将canvas转换为base64格式的图片
var base64Img = canvas.toDataURL('image/png');
// 将base64格式图片赋值给img标签的src属性
var img = document.createElement('img');
img.src = base64Img;
// 将img标签添加到页面中
document.body.appendChild(img);
```
阅读全文