js获取网页源代码

直接说结论：用JavaScript拿“当前页面”的网页源代码，就一行——document.documentElement.outerHTML。源代但你要是网页想拿别人网站的源码，那就得绕路了，源代因为浏览器安全策略挡着，网页跨域请求默认不给过。源代这事儿我踩过坑，网页写下来给你参考。源代

先说我踩的网页坑。去年做个数据抓取的源代小工具，想从某个公开接口页面拉HTML，网页直接用了fetch(url)，源代结果控制台报错——CORS。网页当时我愣了半天，源代后来才明白，网页浏览器把“读取别人家页面”和“读取自己家页面”分得清清楚楚。你要是只想调试自己的页面，那document.documentElement.outerHTML够用了，它会把整个DOM树序列化成字符串，包括所有标签、属性、文本，连注释都带上。

但有个细节容易忽略：outerHTML拿到的是“当前DOM状态”，不是服务器返回的原始字节。比如页面里有个按钮，你点击后改变了它的class，那拿到的源码里class就是改过的。想要“纯净版”？得用XMLHttpRequest或fetch去请求当前URL，但前提是服务器允许同源——自己请求自己当然允许，但如果你在本地用file://协议打开HTML，再请求http://地址，照样被拦。

跨域怎么办？现实点说，纯前端无解。你可以用代理服务器转发请求，或者用JSONP——但那只适用于支持回调的接口，HTML页面一般不支持。我后来用了Node.js写了个小脚本，用axios直接请求目标URL，绕开浏览器限制，因为Node.js没有CORS概念。这算是个土办法，但有效。

还有个冷门技巧：如果你只需要“看到”源码，不用存下来，可以打开浏览器开发者工具（F12），切到“Network”标签，刷新页面，点第一个请求，看“Response”面板。那才是服务器吐出来的原始HTML，未经DOM操作污染。这个动作本质上是浏览器替你完成了请求，跟你写JS无关，但很多人不知道。

写代码时有个细节值得注意：outerHTML对某些特殊字符会做转义，比如<会变成<，但实际打印到控制台时，浏览器会自动还原显示。如果你要存文件或发请求，得自己处理转义。我试过用Textarea元素来解码，但后来发现直接用DOMParser更干净——虽然慢点，但不会出错。

最后说个反直觉的事：有时候你拿到的“源码”根本不是人写的。现在很多网站都是前端渲染，服务器只给个空壳子，内容全靠JS动态生成。你抓到的HTML里全是<div id="root"></div>，真正的数据在JS文件里。这种页面，用outerHTML抓源码等于抓了个寂寞。要拿真实内容，得用无头浏览器（比如Puppeteer）模拟完整渲染，或者找接口直接拿JSON。我上次抓一个新闻站，折腾半天源码，最后发现人家有公开的API，直接请求JSON比解析HTML快十倍。

所以，js获取网页源代码这事儿，分三层：自己页面用outerHTML，同源请求用fetch，跨域就上代理或Node。别指望浏览器放水，它拦你是为你好——不然随便一个网页就能读你银行账户的HTML了，那还了得。