How can we convert a div
element into an image without using canvas?
The browser that organization currently uses is IE8 and canvas is not compatible with it.
I'm looking for a solution using only JavaScript/jQuery.
Yes we can convert a div element into an image by using dom-to-image .
dom-to-image is a library which can turn arbitrary DOM node into a vector (SVG) or raster (PNG or JPEG) image, written in JavaScript.
var node = document.getElementById('my-node'); //assign our dom id to a variable
domtoimage.toPng(node)
.then(function (dataUrl) {
var img = new Image();
img.src = dataUrl;
document.body.appendChild(img); //append the converted image to html body
})
.catch(function (error) {
console.error('oops, something went wrong!', error);
});
Here is the simple example of converting html dom to image
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.