爬虫必须先看懂html标签嵌套结构，因为所有提取动作均发生在内，其层级关系直接决定css选择器能否命中目标节点；需区分原始html与js渲染后dom，注意声明、剥离干扰、优先使用语义化标签和稳健选择器。
爬虫为什么必须先看懂
因为所有爬虫提取动作都发生在 内，而 的层级关系直接决定 selector 能不能命中目标节点。浏览器渲染前会把 HTML 文本解析成 DOM 树，爬虫库（如 BeautifulSoup、lxml、PyQuery）底层也是模拟这个过程；如果误把注释、<script></script> 或 <style></style> 里的伪 HTML 当真，selector 就会失效。
常见错误现象：find('p') 返回空列表，但网页明明有段落 —— 很可能是因为目标 <p></p> 实际藏在某个 <div class="content"> 下，而你没加父级约束；或者页面用了 JS 动态插入内容，原始 HTML 根本没有那段 <code><p></p>。
- 务必确认你解析的是服务器返回的原始 HTML，不是浏览器渲染后的结果（后者需用 Selenium 或 Playwright）
-
里几乎不存业务数据，但<meta name="description">和<meta property="og:title">这类元信息常被用于 SEO 抓取，别一概跳过 - HTML5 语义化标签（
<article></article>、<section></section>、<nav></nav>）比一堆<div> 更易定位，优先查它们 <h3> <code><meta charset="UTF-8">不只是声明，它影响中文能否正确 decode很多静态页面抓下来是乱码，不是编码识别错了，而是你跳过了
<meta charset="UTF-8">这行声明，直接用系统默认编码（比如 GBK）去解 bytes。requests 默认按 HTTP 头的Content-Type解码，但有些服务器头写得不规范，真正权威的编码声明其实在 HTML 的<meta>标签里。使用场景：当你用
response.text发现中文是 ，但response.content是正常 bytes，说明解码环节出问题了。
Claude风格HTML汇报文件下载生成Claude风格的精美单页HTML汇报文件。当用户需要生成"汇报"、"周报"、"月报"、"项目进度"、"复盘"、"演示"、"slide deck"、"状态报告"、"工作总结"时触发。支持6种模板：周报(weekly)、项目进度(project)、月度总结(monthly)、复盘报告(postmortem)、演示文稿(slid
- 用
BeautifulSoup(response.content, 'html.parser', from_encoding='utf-8')强制指定编码，比依赖response.text更稳 - 不要硬写
.encode('utf-8').decode('gbk')补救 —— 这属于掩盖问题，不是解决问题 - 某些老站用
<meta http-equiv="Content-Type" content="text/html; charset=GBK">，注意匹配真实声明
为什么
<script></script>和<noscript></noscript>里的 HTML 字符串不能直接 parse因为它们是 JS 字符串字面量或注释内容，不是真实 DOM 节点。例如
");，这段<script>document.write("<p>动态内容</script><p></p>在原始 HTML 中只是字符串，不会被 parser 当作标签处理。性能影响：如果你对整页 HTML 做正则匹配
<p>.*?</p>，很容易跨标签捕获到<script></script>里的干扰内容，导致提取错乱。- 用
soup.find('script')先剥离所有<script></script>节点，再 parse 剩余部分，能避免 90% 的误匹配 -
<noscript></noscript>里的内容是给禁用 JS 的用户看的，有些站点会把关键数据放这儿作为 fallback，别直接删 - 遇到
innerHTML = "...<div class="price">¥99</div>..."这种，得用 JS 执行环境还原，纯 HTML 解析器无能为力
DOM 树深度太深时，用 CSS 选择器比逐层
.find()更可靠比如目标元素路径是
> <div id="app"> > <main> > <article> > <section class="content"> > <p>，写六层 <code>.find().find().find()...容易中途返回None导致 AttributeError，而soup.select('article section.content p')会直接返回所有匹配的<p></p>列表，空则返回[]，更易判断和容错。容易踩的坑：CSS 选择器中的空格表示后代，
>表示子元素，但 BeautifulSoup 默认 parser（html.parser）不完全支持>；lxml 支持更全，但要求安装 C 依赖。- 简单场景优先用
soup.select('.content p')，不用soup.find(class_='content').find_all('p') - 含 ID 的路径（如
#main .title）比纯 class 更稳定，因为 ID 理论上唯一 - 避免用
soup.select('div div div p')这种无语义路径 —— 页面稍一改版就全崩
<meta>声明写着 UTF-8，但服务端实际发的是 GB2312；还有些网站故意把关键字段拆成多个<span></span>拼接，靠视觉对齐骗人 —— 这些都得结合网络面板、原始响应体和运行时 DOM 对照着看。 - 用
