解决方法:使用onclone去除tr背景颜色

html_to_image2: function(ele,head) {
    html2canvas(ele,{
        onclone: function(clonedDoc) {
            // 在这里修改克隆的 DOM 元素
            clonedDoc.querySelectorAll('tr').forEach(function (item) {
                item.style.backgroundColor = 'transparent';
            });
        }
    }).then(canvas => {
        // 将 canvas 转换为图片并显示或下载
        document.body.appendChild(canvas); // 可选:在页面上显示 canvas
        $('canvas').hide();
        const imgData = canvas.toDataURL("image/png"); // 将 canvas 转换为图片数据URL
        const link = document.createElement('a'); // 创建一个链接元素来下载图片
        link.download = head + '.png'; // 设置下载文件名
        link.href = imgData; // 设置链接的 href 为图片数据URL
        link.click(); // 模拟点击以触发下载
    });
},

标签: none

评论已关闭