🐚作者简介：花神庙码农（专注于Linux、WLAN、TCP/IP、Python等技术方向）
🐳博客主页：花神庙码农 地址：https://blog.csdn.net/qxhgd
🌐系列专栏：善假于物
📰如觉得博主文章写的不错或对你有帮助的话，还望大家三连支持一下呀！！！ 👉关注✨点赞👍收藏📂
前言
- 捕获屏幕内容是一个非常常见的功能需求，我非常确定在你当前的计算机上已经有了非常方便的截图工具了。但是，你可以完成以下任务吗？
– 截取网页上所有内容的屏幕快照，包括窗口中未显示的所有内容。
– 精确捕获DOM元素的内容 - 本文整理了通过Edge、chrome两种浏览器解决上述问题的方法。
Edge浏览器
- 步骤1、启动 Edge 浏览器（Edge Canary以上版本），在微软Edge浏览上打开需要截图的网页；
- 步骤2、下面两种方法任选一种，皆可：
– 方法一、在浏览器右上角选择省略号“…”或者按快捷键「ALT + F」打开「设置及其他」菜单，在弹出的菜单下方选择“网页捕获”；
– 方法二、或者直接使用快捷键 Ctrl + Shift + S调出“网页捕获页面
- 步骤3、选择“整页”而非“自由选择区域”进行整页截屏
- 步骤4、之后可以在本地对截的全网页进行涂鸦注释或修改，当然也可以直接保存整个页面。
Chrome浏览器
-
步骤1、使用chrome浏览器，打开目标网站
-
步骤2、按下键盘上 “F12” 或者 “Ctrl + Shift + I"或者页面选择“More Tools->Developer Tools"(中文“更多工具->开发者工具”打开调试页面
-
步骤3、按下键盘上 “Ctrl+Shift+P”
-
步骤4、键入内容“ capture ” 后，根据自己的需要选择以下任意，全网页截屏可以选第一个(“capture full size screenshot”)：
“capture full size screenshot”【整个网页，全网页截屏】
“capture node screenshot”【节点网页】
“capture screenshot”【当前屏幕】
注意：如果chrome是中文版本，则这步需要输入“截屏"字样，之后出现的也将是中文的菜单;
- 步骤5、按下回车即可。
注意：本文的操作基础是Windows系统，如果是其他操作系统，快捷键或页面等细节可能略有不同。
如果你有更好的解决方案，欢迎在本文下方留言；
如本文对你有些许帮助，欢迎大佬加关注、评论、点赞，有关必回。
