应使用 document.querySelectorAll('.to-clear') 精准选取目标段落，再通过 textContent = '' 清空文字内容，避免误删全局段落或触发不必要的重排重绘。
用 JavaScript 的 querySelectorAll 找到所有目标段落
HTML 本身没有“批量删除文字”的能力，必须靠 JavaScript 操作 DOM。核心是先精准选中要处理的 <p></p> 元素——不能只写 document.querySelectorAll('p')，否则会误删整个页面所有段落。
常见做法是加 class 或 data 属性来标记目标段落，比如：<p class="to-clear">这段要清空</p>，然后用 document.querySelectorAll('.to-clear') 获取节点列表。
如果段落有规律可循（如连续出现在某个容器内），优先用父容器限定范围，例如：document.querySelector('#content').querySelectorAll('p')，避免全局污染。
用 textContent 或 innerText 清空文字内容
清空段落里的文字，不是删掉整个 <p></p> 标签，而是把它的文本内容设为空字符串。推荐用 textContent，它更直接、更快，且不触发重排重绘。
立即学习“前端免费学习笔记（深入）”；
innerText 会受 CSS 影响（比如 display: none 的子元素不计入），还可能触发回流，在批量操作时没必要承担这个开销。
实操示例：
document.querySelectorAll('.to-clear').forEach(p => {
p.textContent = '';
});
注意：别用 p.innerHTML = ''，除非你明确需要清除内嵌的 HTML 标签；否则纯文本场景下，textContent 更安全、更轻量。
保留段落结构但隐藏文字？小心 visibility 和 display 的区别
有时候所谓“删除文字”，其实是想让段落看起来空，但保留占位或后续可恢复。这时别直接清空内容，改用 CSS 控制显示状态：
-
visibility: hidden：文字不可见，但段落仍占布局空间，textContent也还在，随时能读取或恢复 -
display: none：段落彻底从渲染树移除，不占空间，但后续想恢复就得手动改样式，且无法通过 JS 直接读取原文字（除非你提前缓存）
如果只是临时“隐藏”，建议用 visibility + 提前缓存 textContent：
const ps = document.querySelectorAll('.to-hide');
ps.forEach(p => {
p.dataset.originalText = p.textContent;
p.style.visibility = 'hidden';
});
批量操作后记得检查事件监听器是否还有效
如果你给这些段落绑过点击、输入等事件，用 textContent = '' 不会影响事件绑定——因为元素没被替换或销毁。这点和用 innerHTML = '' 不同，后者会清除子节点，连带移除动态添加的事件监听器（除非用事件委托）。
但如果你后续要往清空后的段落里插入新内容（比如用 appendChild 或 insertAdjacentHTML），要注意插入位置是否符合预期——清空后段落是空的，firstChild 为 null，直接操作子节点容易报错。
真正容易被忽略的是：批量清空后，如果有依赖段落文本长度的逻辑（比如自动截断、字数统计、表单校验），这些逻辑不会自动重新触发，得手动调用或触发对应更新。
