如何获取浏览器已渲染但审查元素中不存在的数据

你遇到的「页面可见内容无法通过DOM选择器定位、审查元素找不到对应节点」的情况，主要对应三类前端渲染机制：

• Shadow DOM 隔离渲染：这是浏览器原生支持的DOM隔离能力，站点会将需要防爬、需要样式隔离的内容放到独立的Shadow Root节点树中，和主文档的DOM树完全隔离。你常用的find_elements_by_class_name、id定位等普通DOM查询方法只能访问主文档DOM树，无法穿透Shadow Root查询内部元素，部分浏览器审查元素默认也会隐藏Shadow DOM内部结构，就会出现你看到的现象。
• Canvas/WebGL 像素渲染：所有可见内容均不是DOM节点，是通过JS调用绘图API直接绘制在画布上的像素内容，整个功能块仅对应页面上一个<canvas>标签，自然不存在可供定位的class、id对应节点。
• 离屏DOM转图片渲染：站点会在内存中临时渲染包含数据的DOM节点，直接转成base64图片后插入主文档，最终你看到的内容是图片格式，也不存在对应的DOM元素。

对应解决思路 #

• 若为Shadow DOM场景：以Selenium为例，你可以先定位到Shadow Root的宿主节点，调用shadow_root属性获取隔离的DOM树实例，再调用对应的元素查询方法即可定位内部节点。
• 若为Canvas/图片渲染场景：不需要再尝试DOM定位，可直接抓取对应数据的后端接口返回值，或通过OCR识别对应区域的内容获取数据。

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