如何查看网页源代码

```html

按一下 Ctrl+U。何查就这么简单。看网浏览器立刻弹出一个新标签页，页源满屏密密麻麻的代码尖括号和英文单词——那就是你正在看的这个页面的“底稿”。我第一次干这事是何查十几年前，想扒一个网页的看网背景音乐地址，结果对着满屏 <div> 和 <script> 发了十分钟呆。页源现在方便多了，代码但大多数人从来没按过那个快捷键。何查

右键菜单里藏着一个更直观的看网入口。在页面任意位置（避开图片和链接）点鼠标右键，页源菜单里有一项叫“查看网页源代码”或者“查看页面源代码”。代码Chrome 叫“查看网页源代码”，何查Firefox 叫“查看页面源代码”，看网Edge 两者混着来。页源点下去，效果和 Ctrl+U 一样。我习惯用右键，因为有时候左手正端着咖啡。

但注意，你看到的源代码和浏览器实际渲染出来的页面可能不一样。比如你用 JavaScript 动态插入了一段文字，Ctrl+U 看到的原始 HTML 里根本没有那段文字。这时候得用开发者工具。按 F12 或者 Ctrl+Shift+I，弹出一个面板，切到“Elements”标签页。这里显示的是浏览器解析后的 DOM 树，实时反映当前状态。你可以直接双击某个 <h1> 标签，把标题改成“我爱吃西瓜”，页面上立刻跟着变。当然刷新就没了。

手机上看源代码稍微麻烦点。安卓 Chrome 没有直接的查看源代码菜单。有个土办法：在地址栏输入 view-source: 再加上网址，比如 view-source:https://example.com。iOS 的 Safari 需要先在“设置- Safari -高级”里打开“网页检查器”，然后用 Mac 连上手机调试。我试过一次，步骤多到让人想摔手机。所以手机上我基本不干这事。

查看源代码到底有什么用？说几个我实际遇到的场景。有次帮朋友改一个单页网站，他忘了后台密码，但页面里内联了一段 JavaScript 验证逻辑。我 Ctrl+U 找到那段代码，发现密码就明文写在 if (input === "admin123") 里。还有一次下载一个老式网页的音频，右键“另存为”没反应，查看源代码搜索 .mp3，直接拿到文件地址。更常见的是学习别人的 CSS 布局——看到某个按钮的圆角和阴影特别顺眼，右键“检查”，在 Styles 面板里直接抄走那几行代码。

不过别指望源代码里什么都有。现在前端框架流行，React、Vue 打包后的代码经过压缩和混淆，变量名全是 a、b、c，逻辑绕得像迷宫。我上次想看看某个在线工具怎么计算汇率，打开源代码，两万行压缩后的 JavaScript，当场放弃。这种情况不如直接看 Network 面板里的 API 请求。

还有个坑：有些网站会禁用右键菜单。你一点右键，弹出“禁止复制”的提示。别慌，Ctrl+U 照样管用。如果连 Ctrl+U 都被 JavaScript 拦截了，按 F12 打开开发者工具，在 Console 里输入 document.body.oncontextmenu = null 回车，右键就恢复了。这招我用了无数次，每次都有种破解了小把戏的快感。

最后说个冷门的：view-source: 协议不仅能在地址栏用，还能做成书签。把 javascript:window.location='view-source:'+window.location.href 存成书签，点一下就能看当前页面的源代码。我放在书签栏好几年了，比记快捷键还顺手。当然，现在很多网站用 Content-Security-Policy 禁止了 view-source:，点了没反应。那就老老实实 Ctrl+U 吧。