順序刪除 <br> 在CMS用戶通過富文本編輯器填充的div中

Question

我有由CMS用戶填充的div區域，並通過富文本編輯器發送數據。 如何使用jQuery在<div>刪除兩個以上的連續br標簽？

我嘗試了parent() ， closest()但是沒有用。

例如，一位CMS用戶使用富文本編輯器添加了此HTML代碼。

<div class="cms-data">
<br>
<span>
<br><br><br><br><br><br>
<a href="/uploads/755/a1.xls" target="_blank">xls</span></a>
<br><br><br>
</span>
<br><br>
</div>

編輯：我向<div>添加了一個類名，cms-data。

Answer 1

這是一種實現方法：

$("#starting-point").find("br").each(function() {
    if (this.previousSibling && this.previousSibling.nodeName.toUpperCase() == 'BR') {
        $(this).remove();
    }
});

這將找到給定容器中的所有br元素（在我的情況下，是id "starting-point"的元素）。 然后按文檔順序遍歷它們。 如果我們有一個前一個兄弟姐妹是br元素，則將其刪除。 如果它前面的東西不是br元素（例如文本節點或非br元素），我們將不理會它。 請注意，這並不認為<br> <br>是兩個相應的元素，因為它們之間有一個空格。

現場示例 | 資源

Answer 2

DOM！

遇到<br>時，將其刪除。 遇到文本或元素時，不會刪除下一個<br> 。 當遇到一個元素時，也會對其調用removeSequentialBR 。

function removeSequentialBR(node) {
    var child = node.firstChild;
    var remove = true;

    while (child) {
        if (child.nodeType === 1) {
            if (child.nodeName === "BR") {
                if (remove) {
                    var newChild = child.nextSibling;
                    child.parentNode.removeChild(child);
                    child = newChild;
                    continue;
                }

                remove = true;
            } else {
                remove = false;
                removeSequentialBR(child);
            }
        } else if (child.nodeType === 3 && /\S/.test(child.nodeValue)) {
            remove = false;
        }

        child = child.nextSibling;
    }
}

這是一個演示。

Answer 3

您可以僅使用正則表達式來解析文本並替換所有不適合的出現

value = value.replace("/(<br>(\s)*){2,}/","<br><br>");

1000是一個神奇的高數字，其中應包括所有<br> ； 如果需要，請增加此值。 也許有無限的價值？ 可能是0？

編輯：對不起，不好的答案。 我修正了這個表情。 現在，它可以正常工作，並且可以找到所有可能發生的事件。