Question

这可能看起来很奇怪。我有一个id为'quotes'的div，里面有一个blockquote。我认为添加换行符会很有意思，如果引用的文本是诗歌，我认为你可以使用'@'作为条件换行符，然后将其替换为br元素，如下所示：

function addBr() {
    var c = document.getElementById("quotes");
    var t = c.getElementsByTagName("blockquote");    
    var reg = new RegExp("@", "g");
    for (var i = 0; i < t.length; i++) {
        var r = t[i].lastChild.nodeValue.match(reg);
        if (r !== null) {
            var text = t[i].childNodes[0];
            var q = t[i].lastChild.nodeValue.indexOf("@");
            var x = document.createElement("br");
            t[i].insertBefore(x, text.splitText(q));
            t[i].lastChild.nodeValue = t[i].lastChild.nodeValue.replace(/\@/g, "");
        }
    }
}

这样可行，但仅适用于第一个实例，所以我需要一个循环，但我无法弄明白。 div就像这样：

<div id = 'quotes'>
<blockquote> Some line, @ Some line, @ Some line@ </blockquote>
</div>

任何暗示都会受到高度赞赏。

Answer 1

从文本节点中的@的最后一个匹配开始，然后向后工作。以下函数执行此操作并且还具有消除不必要的正则表达式，使用更清晰的变量名称并且更短的优点：

function addBr() {
    var c = document.getElementById("quotes");
    var t = c.getElementsByTagName("blockquote");
    for (var i = 0; i < t.length; i++) {
        var splitPos, textNode = t[i].lastChild;

        while ( (splitPos = textNode.data.lastIndexOf("@")) != -1 ) {
            var newTextNode = textNode.splitText(splitPos);

            // Remove the @ from the start of the new text node
            newTextNode.deleteData(0, 1);

            var br = document.createElement("br");
            t[i].insertBefore(br, newTextNode);
        }
    }
}

Answer 2

我建议只是这样做：

function addBr() {
    var c = document.getElementById("quotes");
    var t = c.getElementsByTagName("blockquote");    
    for (var i = 0; i < t.length; i++)
        r.innerHTML = r.innerHTML.replace(/@/g, "<br />");
}

什么是“条件换行符”？我的代码中没有看到任何决定何时破解行的内容......

将br插入到textnode中

2 个答案: