HTML内容转换成图片

把HTML转换成图片，这是在很多时候都会用到的，比如说证书的生成，打印，当把数据信息填写进证书里面的之后，就需要把这个html转换成图片，然后进行打印。当然了不仅仅只是只把证书生成图片那么简单，甚至只要你想，你还可以把整个HTML页面转换成一张图片都可以，那么接下来用一个简单的例子来演示如何把HTML生成一张图片

首先这是定义好的html内容

这个html页面这是一张证书

那么接下来就把这个html页面生成一张图片, 那么在此次之前，先引入一个插件

主要是用这个插件来进行转换生成，
同时，在前面定义了生成图片的按钮，

定义这个按钮是为了当点击的时候就触发生成图片。同时，把生成好的图片放在了一个定义好的模体框里面，
一开始这个模态框是隐藏起来的。同时，里面也放了个img标签，当此刻这个img标签是没有值的，。都定义好之后开始书写转换生成图片的代码。代码如下，

一开始是先获取按钮的点击事件，然后再获取要生成图片的部分，这里的#certificateBox就是前面证书页面的ID，然后生成图片的路径，再把路径添加到模态框里面的img标签里面，再把模态框显示出来就可以了。

那现在到页面上演示下效果，

可以看到，当点击生成图片的时候，已经把证书生成了图片显示在了模态框里面。

以上是一个把html生成一张图片的例子，可以看到，整个过程是非常简单的。·