通过点击页面按钮，将html生成图片下载，用于分享

<!DOCTYPE html>
<html lang="en">
    <div id="hidden-part"></div>
</body>
</html>

$('#shareBtn').click(function () {
            var $posterContent = $('<div class="poster-container" id="poster-container">\n' +
                '  <h1><a href="/">Qiansou123.com</a></h1>\n' +
                '  <p>提供<strong> 影视 | 动漫 | 小说 | 资源 </strong>搜索</p>\n' +
                '  <p>无需登录，‌无需会员，‌<strong>免费在线观看</strong></p>\n' +
                '  <p>提供<strong>免费资源下载</strong></p>\n' +
                '  <p>#剧荒人 #追剧人</p>\n' +
                '</div>');
            $('#hidden-part').html($posterContent);
            html2canvas(document.getElementById('poster-container'), {
                imageTimeout: 15000, //newline
                useCORS: true
            }).then(function(canvas) {
                // 将Canvas转换为Blob对象
                canvas.toBlob(function(blob) {
                    var url = URL.createObjectURL(blob);
                    var a = document.createElement('a');
                    a.href = url;
                    a.download = 'qiansou123.png'; // 指定下载文件的名称和格式
                    document.body.appendChild(a);
                    a.click();
                    document.body.removeChild(a);
                    URL.revokeObjectURL(url); // 释放URL对象
                });
            });
            $('#hidden-part').html('');
        });

易享写作 - 专业在线小说创作工具

🚀 易享写作 - 专业在线小说创作工具

欢迎使用 易享写作 (MakeANovel) —— 一款专为小说创作者设计的在线平台。无论您是网文作家、文学爱好者还是故事创作者，这里都能提供您所需的强大工具。

人物关系图生成器：可视化梳理复杂角色关系，创作更轻松。
在线创作与保存：实时保存，多设备同步，灵感永不丢失。
作品系统管理：清晰管理您的所有小说项目和章节。
便捷分享与反馈：方便获取读者意见，助力作品完善。

🌟 立即免费体验易享写作

🚀 易享写作 - 专业在线小说创作工具

相关文章