如何查找无id属性的div并清除其内部的HOUSE文本内容

实现方案 #

你可以根据自己的使用场景选择以下任意一种方案：

方案1：通过共同style属性匹配（DOM已渲染场景优先，准确率最高） #

所有目标div的style属性存在完全一致的公共特征，可直接通过CSS属性选择器定位：

// 匹配带有目标特征样式的div，使用包含匹配适配style微小变动
const targetDivs = document.querySelectorAll('div[style*="position:absolute"][style*="pointer-events:none"][style*="font-size:8px"]');
targetDivs.forEach(div => {
  // 仅清空文本，保留div元素本身和所有属性
  div.textContent = '';
});

方案2：通过文本内容匹配（无其他同内容div时使用） #

如果可以确认页面内没有其他文本内容为HOUSE的div，可以直接遍历所有div匹配内容：

document.querySelectorAll('div').forEach(div => {
  if (div.textContent.trim() === 'HOUSE') {
    div.textContent = '';
  }
});

方案3：纯HTML字符串处理场景（元素未插入DOM时使用） #

如果你拿到的是还未插入页面的原始HTML字符串，可以直接用正则替换：

// 你的原始HTML字符串
const originHtml = `<div><div style="padding:0!important;right:0!important;line-height:12px;display:block!important;font-size:8px!important;bottom:0!important;margin:0!important;text-align:center;position:absolute!important;opacity:0.8400000000000001!important;left:0!important;top:0!important;pointer-events:none">HOUSE</div></div>...`;
// 替换掉HOUSE文本，保留div结构
const resultHtml = originHtml.replace(/(<div[^>]+>)HOUSE<\/div>/g, '$1</div>');

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