Question

我的HTML包含divs其中一些没有任何内容，有些只包含空格。我想用正则表达式删除那些divs。

我写了代码，但似乎不对。 fiddle

var patt= new RegExp("<div></div>");
document.querySelector('.wrapper').innerHTML.replace(patt,'')

Answer 1

使用dom操作代替正则表达式修改html内容

＆＃13;

var els = document.querySelectorAll('.wrapper div'),
  el;
for (var i = 0; i < els.length; i++) {
  el = els[i];
  if ((el.textContent || el.innerText).trim() == '') {
    el.parentNode.removeChild(el)
  }
}

＆＃13;

div:not(.wrapper) {
  background-color: #ff0000;
  padding: 10px;
  margin: 5px
}

＆＃13;

<div class="wrapper">
  <div>text</div>
  <div></div>
  <div>text</div>
  <div>text</div>
  <div><span></span>
  </div>
  <div>
  </div>
</div>

＆＃13;

Answer 2

String.replace（）不会更改原始字符串。
您应该使用＆＃34; g＆＃34;标记以删除所有空div而不仅仅是第一次出现。

var patt = new RegExp("<div>\\s*</div>", "g");
var wrapperDiv = document.querySelector('.wrapper');
wrapperDiv.innerHTML = wrapperDiv.innerHTML.replace(patt, '')

Answer 3

在这些代码之间添加\\s* .. \\s*匹配零个或多个空格（垂直以及水平空格）。

var patt= new RegExp("<div>\\s*</div>", "g");

var s = '<div class="wrapper">\n    <div>text</div>\n    <div></div>\n    <div>text</div>\n    <div>text</div>\n    <div></div>\n</div>'
alert(s.replace(/<div>\s*<\/div>/g, ''))

或

var s = '<div class="wrapper">\n    <div>text</div>\n    <div></div>\n    <div>text</div>\n    <div>text</div>\n    <div></div>\n</div>'
alert(s.replace(/\s*<div>\s*<\/div>/g, ''))

使用正则表达式删除没有内容或只有空格的div

3 个答案: