目前有个项目需要html转canvas再转img发给后台；于是搜了一波百度，找了一种最适合的

html2canvas.js

官网 http://html2canvas.hertzen.com/
官网首页就给了用法，非常nice
但是这只解决了html转画布，还需要再转img

<div id="capture" style="padding: 10px; background:url(img/xkbj.jpg)no-repeat;">
    <h4 style="color: #000; ">Hello world!</h4>
</div>
<div class="showimg">
    <img src=" ">   <!-- //生成的图片放在此处 -->
</div>


//如果元素有图片，最好再图片加载完后再生成canvas
window.onload = function(){
        html2canvas(document.querySelector("#capture")).then(canvas => {
          var dataURL = canvas.toDataURL();   //canvas转为base64
             $(".showimg img").attr("src",dataURL);//加载为图片
        });
    }
    

大功告成，不过，如果你要生成图片的dom里有图片，比如案例里有张背景图片，预览的时候时候，会发现报错了，那是图片资源不能跨域，要放在服务里运行，iis下运行就没任何问题了

参考网站 https://blog.csdn.net/prefect2011/article/details/79209410