html页面转成图片，并提供下载

（2）下载素材

html2canvas.min.js下载地址：

canvas2image.js下载地址：

base64.js下载地址：

（3）引入js

    <script src="你的路径/html2canvas.min.js"></script>    <script src="你的路径/canvas2image.js"></script>    <script src="你的路径/toimg/base64.js"></script>

（4）放置按钮

<li><a id="btnSave">转换成图片</a></li>

（5）js代码，生成图片，并下载

<script>/*生成canvas图形*/// 获取按钮idvar btnSave = document.getElementById("btnSave");// 获取内容idvar content = document.getElementById("content");// 进行canvas生成btnSave.onclick = function(){html2canvas(content, {     onrendered: function(canvas) {     //添加属性     canvas.setAttribute(‘id‘,‘thecanvas‘); //赋、读取属性值         document.getElementById(‘images‘).appendChild(canvas);         var oCanvas = document.getElementById("thecanvas");     /*自动保存为png*/// 获取图片资源        var img_data1 = Canvas2Image.saveAsPNG(oCanvas, true).getAttribute(‘src‘);    var save_link = document.createElementNS(‘http://www.w3.org/1999/xhtml‘, ‘a‘);save_link.href = img_data1;save_link.download = "Name_Img";/*下面的为原生的保存，不带格式名*/var event = document.createEvent(‘MouseEvents‘);event.initMouseEvent(‘click‘, true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);save_link.dispatchEvent(event);    }   });}</script>

（6）对js代码解析

        content：为要生成图片区域的id。

        Name_Img :下载图片的名称。

（7）将生成的图片隐藏起来，不做显示，在测试时可以显示。

<div id="images" style="display:none;"></div>