我正在构建一个叫做“HTML Quiz”的东西。它完全在 JavaScript 上运行，非常酷。
最后，会弹出一个结果框，上面写着“你的结果:”，它显示了他们花了多少时间，他们得到了多少百分比，以及他们在 10 道题中答对了多少题。我想要一个显示“捕获结果”的按钮，让它以某种方式截取屏幕截图或 div 的某些内容，然后只在页面上显示捕获的图像，他们可以在页面上右键单击并“将图像另存为”。
我真的很想这样做，这样他们就可以与他人分享他们的成果。我不希望他们“复制”结果，因为他们可以很容易地改变它。如果他们更改图像中的内容，哦，好吧。
有谁知道这样做或类似的方法吗？
最佳答案
不，我不知道有什么方法可以“截屏”元素，但是您可以将测验结果绘制到 Canvas 元素中，然后使用 HTMLCanvasElement 对象的 toDataURL 函数获取包含图像内容的 data: URI。
测验完成后，执行以下操作:
var c = document.getElementById('the_canvas_element_id');
var t = c.getContext('2d');
/* then use the canvas 2D drawing functions to add text, etc. for the result */
当用户点击“Capture”时，执行以下操作:
window.open('', document.getElementById('the_canvas_element_id').toDataURL());
这将打开一个带有“屏幕截图”的新选项卡或窗口，允许用户保存它。无法调用各种“另存为”对话框，因此我认为这是您能做的最好的事情。
关于javascript - 如何使用 JavaScript 截取 div 的屏幕截图？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43381827/