怎样在JavaScript中实现截图功能？

// 使用html2canvas库实现截图
import html2canvas from 'html2canvas';

const captureScreenshot = async () => {
    const element = document.body; // 你可以选择任何你想要截图的DOM元素
    const canvas = await html2canvas(element);
    const dataUrl = canvas.toDataURL('image/png');

    // 创建一个新的a元素来下载图片
    const link = document.createElement('a');
    link.download = 'screenshot.png';
    link.href = dataUrl;
    link.click();
};

// 调用截图函数
captureScreenshot();

// 全页截图示例
import html2canvas from 'html2canvas';

const fullPageScreenshot = async () => {
    const element = document.body;
    const canvas = await html2canvas(element, {
        scrollX: 0,
        scrollY: -window.scrollY,
        useCORS: true,
    });

    // 计算总高度
    let totalHeight = 0;
    let currentHeight = 0;
    while (currentHeight < element.scrollHeight) {
        await new Promise(resolve => setTimeout(resolve, 100));
        window.scrollTo(0, currentHeight);
        currentHeight += window.innerHeight;
        totalHeight += window.innerHeight;

        const partCanvas = await html2canvas(element, {
            scrollX: 0,
            scrollY: -currentHeight + window.innerHeight,
            useCORS: true,
        });

        const partContext = canvas.getContext('2d');
        partContext.drawImage(partCanvas, 0, totalHeight - window.innerHeight);
    }

    const dataUrl = canvas.toDataURL('image/png');

    // 创建一个新的a元素来下载图片
    const link = document.createElement('a');
    link.download = 'fullpage_screenshot.png';
    link.href = dataUrl;
    link.click();
};

// 调用全页截图函数
fullPageScreenshot();

// 提高canvas分辨率
const canvas = await html2canvas(element, {
    scale: window.devicePixelRatio,
});