jquery 网页生成图片

// 设置高分辨率
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
canvas.width = window.innerWidth * window.devicePixelRatio;
canvas.height = window.innerHeight * window.devicePixelRatio;
ctx.scale(window.devicePixelRatio, window.devicePixelRatio);

// 使用 html2canvas 库生成图片
html2canvas(document.body).then(function(canvas) {
    document.body.appendChild(canvas);
});

// 确保所有元素可见
$('body').css('visibility', 'visible');

// 禁用动画
$('body').css('animation', 'none !important');
$('body').css('-webkit-animation', 'none !important');

// 使用 html2canvas 库生成图片
html2canvas(document.body).then(function(canvas) {
    document.body.appendChild(canvas);
});

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>生成图片示例</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
</head>
<body>
    <div id="content">
        <h1>这是一个示例网页</h1>
        <p>这是一个段落。</p>
    </div>
    <button id="capture">生成图片</button>

    <script>
        $(document).ready(function() {
            $('#capture').click(function() {
                html2canvas(document.getElementById('content')).then(function(canvas) {
                    document.body.appendChild(canvas);
                });
            });
        });
    </script>
</body>
</html>