警惕 Chrome 的查看源代码 (View Page Source) 功能
这篇讲的是一个容易被忽略但确实存在的浏览器行为陷阱。作者在排查一个前端问题时，最初怀疑是自己HTML代码输出的内容有误，但追踪后发现，问题的根源竟然出在 Chrome 浏览器的“查看源代码”功能上。 具体来说，当你在页面上右键选择“查看网页源代码”时，Chrome 为了呈现一个“纯净”的、未经DOM操作修改的初始HTML，实际上会重新向服务器发起一次独立的请求，以获取原始的响应内容。这意味着，这个功能并非简单地在本地渲染和显示已接收的DOM，而是在后台静默地执行了网络请求。 这个发现对开发者至关重要。因为在调试过程中，如果依赖“查看源代码”来确认服务器返回的原始内容，你看到的可能并非当前页面状态下真正使用的那份资源。尤其是在涉及动态渲染、服务端逻辑或需要特定会话信息才能正确返回内容的场景下，两次不同的请求（页面加载的请求与查看源代码触发的请求）完全可能得到不同的响应结果，从而误导调试方向。 文章提醒我们，浏览器开发者工具中的“Elements”面板才是查看当前页面实时、最终DOM结构的正确入口。理解工具的工作原理，能避免在排查问题时走进不必要的弯路。