如何在 chrome 中捕获完整节点截图?

如何在 chrome 中捕获完整节点截图?

Chrome 开发者工具允许捕获节点截图。不幸的是,它只能捕获节点的可见部分。我需要完整的节点。

还有“捕获全尺寸屏幕截图”命令,但它捕获整个页面。我只需要单个节点。

那么,我如何才能捕获完整节点(它高于屏幕)?

答案1

您可以更改节点的样式,使其全长可见,然后截取节点屏幕截图,或者删除页面的其他元素并截取整个页面的屏幕截图。

附节点截图:

  • 编辑节点的样式,使其延伸到全高(删除高度、最大高度等)
  • 如果必要的话,删除相邻元素
  • 捕获节点截图。

附页面截图:

  • 移动要截屏的节点,使其成为body标签的直接后代
  • 删除页面的其他可见元素
  • 编辑节点的样式,使其延伸到全高
  • 截取整页截图。

可以使用“删除元素”选项删除页面元素。

相关内容