textContent提取+trim过滤+join(' ')合并最稳妥，避免空格换行干扰；BeautifulSoup用get_text(strip=True)加filter去空；XPath需用/text()配合strip和filter，防止子元素文本污染。
直接提取并合并 HTML 中多个元素的文本内容，关键不是“拼起来就行”，而是要控制提取范围、过滤干扰、统一分隔逻辑。否则容易拿到空格、换行、子标签文本混杂的脏数据。
用 textContent 提取再 join() 合并最稳妥
这是原生 JS 最可靠的方式，不依赖外部库，且能避免 innerText 的渲染依赖和 innerHTML 的标签污染问题。
-
textContent只读取 DOM 树中的文本节点，不会执行脚本或解析 HTML - 对多个同级元素（比如
document.querySelectorAll('.word')），必须显式遍历 +trim()，否则空<p></p>会贡献空字符串 - 合并时用
join(' ')比join('')更安全——连续空格会被压缩成单个空格，语义更自然
示例：
立即学习“前端免费学习笔记（深入）”；
const els = document.querySelectorAll('p');
const texts = Array.from(els).map(el => el.textContent.trim()).filter(t => t);
const merged = texts.join(' '); // 不留空段落，用空格分隔用 get_text() 在 BeautifulSoup 中合并多 <p></p> 标签内容
Scrapy 或 Python 爬虫场景下，get_text() 比 .text 更可控，尤其面对嵌套结构时。
-
.text是简单拼接所有后代文本，遇到<div>abc<span>def</span>ghi</div>会返回'abcdefg'，无法剥离子元素 -
get_text(separator=' ', strip=True)可指定分隔符，并默认去除首尾空白，适合批量段落合并 - 若需保留段落间换行，传
separator='\n'，但要注意原始 HTML 中的<br>不会自动转为换行符
示例：
立即学习“前端免费学习笔记（深入）”；
soup = BeautifulSoup(html, 'lxml')
ps = soup.find_all('p')
merged = ' '.join(p.get_text(strip=True) for p in ps if p.get_text(strip=True))用 XPath 的 /text() 避免子元素文本污染
在 Scrapy 或 lxml 场景中，如果目标是父容器内“直接文本”（不含子标签里的文字），不能用 //div/text() 简单处理——它会把换行、缩进也当作文本节点返回。
-
//div/text()返回的是 NodeList，可能包含多个空白节点（如'\n '） - 必须配合过滤：只取
node.nodeType == 3（TEXT_NODE）且node.nodeValue.strip()非空 - Scrapy 中推荐写法：
response.xpath('//div[@class="content"]/text()').getall()，再手动strip()和filter()
错误示范：response.xpath('string(//div)').get() —— 这会递归合并所有后代文本，完全失去“仅直接文本”的意图。
别忽略空格、换行、隐藏文本节点这些隐形坑
HTML 源码里肉眼不可见的空白（缩进、换行、注释前后空格）在 DOM 解析后都会变成独立的文本节点。它们不是 bug，是规范行为。
- 用
querySelectorAll+textContent时，trim()必须每项都调，不能只对最终结果trim() - 用 BeautifulSoup 时，
strip=True只作用于每个元素内部，对元素间空格无效；合并前仍需filter(bool)去掉空项 - 服务端生成的 HTML 若含大量模板注释（
<!-- ... -->），某些解析器会将其视为文本节点，需额外排除
真正难的从来不是“怎么连”，而是“连什么、不连什么”——边界稍一模糊，标题、图标替代文字、隐藏字段就全混进去了。
