自己生成的页面,保存为图片,并下载word

自己生成的页面,保存为图片,并下载word

复制代码
 // 下载word
    $(document).on("click",".wordbtn",function(){
        var images = $('.swiper-wrapper .swiper-slide');
        var imagesData = [];
        var promises = [];
        images.each(function() {
            var promise = html2canvas(this).then(function(canvas) {
                var imgData = canvas.toDataURL('image/png');
                imagesData.push(imgData);
            });
            promises.push(promise);
        });

        Promise.all(promises).then(function() {
            var content = `
                <html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'>
                <head><meta charset='utf-8'></head>
                <body>`;
            imagesData.forEach(function(data) {
                content += `<img src='${data}'><br><br>`;
            });
            content += `<p>${$('.text1').html()}</p><p>${$('.text2').html()}</p></body></html>`;

            var blob = new Blob(['\ufeff', content], {type: 'application/msword'});
            saveAs(blob, 'document.doc');
        });


    });
相关推荐
阮小贰10 分钟前
干支编码的确定性实现:节气切分 + 1000 条溯源断语(附 JS 源码)
开发语言·javascript·ecmascript
雪芽蓝域zzs16 分钟前
Vue3 + Vite本地模拟数据(读取 JSON 数据)
前端
亿元程序员18 分钟前
还有高手?用Shader让图片中的3D圆环转起来!
前端
灯澜忆梦20 分钟前
【基于GO的Web开发14】gin请求重定向
前端·后端·golang·gin
qq_4523962321 分钟前
第十一篇:《前端性能优化体系:从加载到交互的全链路》
前端·性能优化·交互
Mh24 分钟前
听说我兄弟喜欢跑车,所以必须安排上
前端·javascript·vue.js
zttbee24 分钟前
vue学习(白话功能版)
前端·vue.js·学习·前端框架
qq_4260039626 分钟前
多语言新增语种全量测试策略
前端·javascript·python·pycharm·自动化
黄敬峰31 分钟前
从零搭建 Next.js 单词管理系统:Supabase + Drizzle ORM + shadcn/ui 全栈实战
javascript·面试
nicole bai34 分钟前
前端封装el-table及注意点
前端·javascript·vue.js