如何定位特定节点？段落中非br节点计数与元素保留求助

现有一段移动端适配脚本，在屏幕宽度≤468px时处理页面中的<p>标签，但存在逻辑缺陷：当前脚本仅针对nodeType === 3的文本节点做判断，导致段落内的<strong>、链接等非文本元素被误删。

需求目标：仅统计并处理<br>标签，保留所有非<br>的节点（包括文本、<strong>、<a>等元素）。例如下面的示例结构：

<p>
  "Text"
  <br>
  <br>
  <strong>
  "Text2"
</strong>
</p>

当前脚本会删除示例中的<strong>元素，不符合预期，需修改脚本实现仅对<br>节点计数处理，其余节点全部保留。

现有脚本如下：

const mediaQuery = window.matchMedia('(max-width: 468px)')
// Check if the media query is true
if (mediaQuery.matches) {
  const paragraphs = document.querySelectorAll("p");

paragraphs.forEach( elem => {
  const nodes = [...elem.childNodes];
  nodes.reduce((count, node) => {
    if(node.nodeType === 3) {
      const isEmpty = node.nodeValue.trim().length === 0;
      return isEmpty ? count : 0; 
    }
    count++;
    if (count>2) node.remove();
    return count;
  }, 0);
});
  
}

核心调整逻辑：仅对<br>节点进行计数，非<br>节点跳过计数流程且永不删除。修改后的脚本如下：

const mediaQuery = window.matchMedia('(max-width: 468px)')
if (mediaQuery.matches) {
  const paragraphs = document.querySelectorAll("p");

  paragraphs.forEach(elem => {
    const nodes = [...elem.childNodes];
    nodes.reduce((brCount, node) => {
      // 仅处理BR标签
      if (node.nodeName === 'BR') {
        brCount++;
        // 当BR数量超过2时删除当前BR
        if (brCount > 2) {
          node.remove();
        }
        return brCount;
      }
      // 非BR节点直接返回当前计数，不做删除操作
      return brCount;
    }, 0);
  });
}

修改说明 #

• 将计数变量更名为brCount，明确其仅统计<br>标签的作用
• 仅当节点为<br>时执行计数逻辑，当计数超过2时删除该<br>节点
• 所有非<br>节点（包括文本节点、<strong>、<a>等）不参与计数，也不会被删除，完全保留原结构
• 移除原脚本中对文本节点的判断逻辑，避免误删其他元素

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