只用一个<br>替换多个<br>

Question

我如何使用JavaScript进行检测

<br>
<br>
<br>

成为一体

<br>

？

我尝试过:

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

但这不适合我.

Answer 1

CSS解决方案

如果要<br>在页面上禁用多重效果,可以在不使用JavaScript的情况下通过CSS执行此操作:

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解决方案.

JavaScript解决方案

// 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演示.

Answer 2

将HTML(以您不想要的形式)发送到客户端浏览器并使其运行JavaScript代码以清理它有什么意义？这看起来像一个糟糕的设计.

如何修复所有静态HTML和HTML生成,以便这些多余的<br>元素不会出现在第一位？

如果使用JavaScript修改文档对象,请执行无法以任何其他方式实现的动态效果.

Answer 3

更简单:

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

这将允许可选的标记终止符(/>)以及标记结束前的空格(例如<br />或<br >).