用多个<br>replace多个<br>

我如何使用JavaScript来检测

<br> <br> <br> 

成为一个

 <br> 

我试着用:

 jQuery('body').html().replace(/(\<br\>\r\n){3, }/g,"\n"); 

但这不适合我。

更简单:

var newText = oldText.replace(/(<br\s*\/?>){3,}/gi, '<br>');

这将允许可选的标签终结符(/>),也可以在标签结束之前的空格(例如<br /><br > )。

CSS解决scheme

如果你想在页面上禁用多个<br>的效果,你可以通过CSS来完成,而不使用JavaScript:

 br + br { display: none; } 
  • 检查jsFiddle演示 。

但是,当您使用标签时,此方法是理想的,如下所示:

 <div>Text</div><br /><br /><br /> <div>Text</div><br /><br /><br /> <div>Text</div><br /><br /><br /> 

在其他情况下,像这样:

 Hello World<br /> <br /> Hello World<br /> <br /> Hello World<br /> <br /> 

它会失败 (因为CSS传递文本节点)。 而是使用JavaScript解决scheme。


JavaScript解决scheme

 // It's better to wait for document ready instead of window.onload(). window.onload = function () { // Get all `br` tags, defined needed variables var br = document.getElementsByTagName('br'), l = br.length, i = 0, nextelem, elemname, include; // Loop through tags for (i; i < l - 1; i++) { // This flag indentify we should hide the next element or not include = false; // Getting next element nextelem = br[i].nextSibling; // Getting element name elemname = nextelem.nodeName.toLowerCase(); // If element name is `br`, set the flag as true. if (elemname == 'br') { include = true; } // If element name is `#text`, we face text node else if (elemname == '#text') { // If text node is only white space, we must pass it. // This is because of something like this: `<br /> <br />` if (! nextelem.data.replace(/\s+/g, '').length) { nextelem = br[i+1]; include = true; } } // If the element is flagged as true, hide it if (include) { nextelem.style.display = 'none'; } } }; 
  • 检查jsFiddle演示 。

发送不需要的HTML格式到客户端浏览器并使其运行JavaScript代码来清理它的意义何在? 这看起来像一个糟糕的devise。

如何修复所有的静态HTML和HTML代,以便这些多余的<br>元素不首先发生?

如果您使用JavaScript来修改文档对象,那么对于无法以其他方式实现的dynamic效果,请执行此操作。

这样的事情不是正确的做法:

 $("br~br").remove() 

编辑:不,这是错误的,因为它的“连续”的定义是太松,根据每个BoltClock。

尝试这个

 $('body').html($('body').html().replace(/(<br>)+/g,"<br>")); 

它将把n个数字代入一个。

演示

尝试这个:

 jQuery('body').html( jQuery('body').html().replace(/(?:<br>\s+){3,}/ig,"\n")); ); 

演示: jsfiddle

我会去这个:

 $('body').html($('body').html().replace(/<br\W?\\?>(\W?(<br\W?\\?>)+)+/g,"<br>")); 

但是,在阅读另一篇文章中的评论之后,我认为你应该尽量避免这样做,以免在后端纠正。

这个解决scheme只是jQuery + DOM,不能像string那样操作HTML,使用文本节点,只忽略空白文本节点:

 $('br').each(function () { const {nodeName} = this; let node = this; while (node = node.previousSibling) { if (node.nodeType !== Node.TEXT_NODE || node.nodeValue.trim() !== '') { break; }; } if (node && node !== this && node.nodeName === nodeName) { $(node).remove(); } }); 

请参阅: https : //jsfiddle.net/kov35jct/