Chrome中查看网页HTML源码有四种方式：一是快捷键Ctrl+U/Cmd+U直接打开view-source页面；二是右键选择“查看网页源代码”；三是用F12打开开发者工具在“元素”面板查看实时DOM树；四是通过“网络”面板刷新后查看document请求的“响应”内容。
如果您在使用 Chrome 浏览器时需要快速定位网页的 HTML 结构或检查前端代码实现，则需调用内置的源代码查看功能。以下是几种直接、可靠的方式获取当前页面原始 HTML 源码的操作流程：
一、使用快捷键直接查看网页源代码
Chrome 提供了系统级快捷键，可绕过开发者工具界面，直接以只读形式打开完整的 HTML 源文件，适用于快速浏览未经渲染的原始标记。
1、确保目标网页已完全加载并处于活动标签页中。
2、按下 Ctrl + U（Windows/Linux）或 Cmd + U（macOS）。
立即学习“前端免费学习笔记（深入）”；
3、浏览器将新开一个标签页，显示纯文本格式的 HTML 源码，地址栏 URL 以 view-source: 开头。
二、通过右键菜单打开网页源代码
该方式不依赖键盘输入，适合快捷键被禁用或用户偏好图形化操作的场景，且无需进入开发者工具环境。
1、在网页任意空白区域单击鼠标右键。
2、从弹出菜单中选择 “查看网页源代码” 选项。
3、新标签页将加载与快捷键方式完全一致的 view-source: 页面。
三、借助开发者工具查看实时渲染后的 DOM 树
此方法展示的是经过 JavaScript 动态修改后的当前 DOM 结构，而非原始 HTML 文件，适用于调试交互行为或审查元素状态。
1、按下 F12 或 Ctrl + Shift + I（Windows/Linux）或 Cmd + Option + I（macOS）启动开发者工具。
2、点击顶部标签栏中的 “元素” 面板（默认激活）。
3、左侧区域即显示当前页面的实时 DOM 树，支持展开折叠、高亮对应网页区域及编辑临时属性。
四、在开发者工具中查看原始 HTML 文件内容
当需确认服务器返回的初始 HTML 是否含特定标签或注释时，可从网络请求中提取未执行脚本前的源码副本。
1、按 F12 打开开发者工具，切换至 “网络” 面板。
2、刷新当前页面，列表中将出现首个请求，其名称通常为页面文件名或 index.html，类型为 document。
3、单击该请求，在右侧选择 “响应” 标签页，即可查看服务器返回的原始 HTML 字符串。
