URL页码变更后页面显示变化但HTML源码一致的技术咨询

为什么两个分页URL的HTML源码完全一致？ #

这是典型的前端动态渲染导致的问题，具体原因大概有这几个：

• 网站采用了单页应用（SPA）架构或基于客户端JavaScript实现分页：服务器返回的只是基础HTML框架（包含通用导航、样式、脚本等），所有分页内容都是浏览器执行JavaScript后动态加载渲染的。URL里的#ful_iPageNumber=7是锚点参数，只会被前端脚本识别并触发对应页码内容的加载，但服务器不会根据这个参数返回不同的HTML。
• 初始HTML包含全量数据：有些网站为了优化加载体验，会把所有分页的内容一次性打包到初始HTML里，再通过JavaScript控制不同页码内容的显示/隐藏。这种情况下，不管访问哪个页码，源码里都会包含所有页面的内容，只是前端脚本只展示当前页码的部分。
• 你查看的是服务器返回的原始HTML，而非浏览器渲染后的DOM：右键“查看页面源码”看到的是服务器第一次发送的原始文件，不是经过JavaScript渲染后的最终页面结构。那些本该在第7页的内容，是前端脚本动态添加到DOM里的，但不会修改原始的HTML源码。

如何获取对应页码的真实内容？ #

如果要拿到某个页码的实际内容，可以试试这些方法：

• 使用浏览器开发者工具查看渲染后的DOM：按F12打开开发者工具，切换到“Elements”标签，这里显示的是经过JavaScript渲染后的实时DOM结构，能看到对应页码的真实内容。
• 使用支持JavaScript执行的爬虫工具：如果是爬虫抓取，可以用Puppeteer、Playwright这类工具，它们会模拟真实浏览器加载页面、执行所有脚本，之后就能获取到渲染后的完整DOM内容。
• 分析前端的API请求：打开开发者工具的“Network”标签，切换到“XHR”或“Fetch”分类，切换页码时观察有没有新的API请求，直接调用这些API就能拿到对应页码的结构化数据（比如JSON格式），比抓取HTML更高效。

内容的提问来源于stack exchange，提问作者mricdev