Question

我有html，我正准备插入dom。在我这样做之前，我需要每30个字符插入一次标记。这样做非常容易：

var html = html.replace(/(.{30})/g, '$1<wbr>');

但是，这个简单的解决方案通常会将标记插入到现有的html标记中。例如，这可能最终发生：

<spa<wbr>n> Some text here </span>

html可能是很多孩子，如此：

<div>
    This is some text that we need to treat. <br />
    <span> Here is some more text. <a href="#"> Click here. </a> </span>
</div>

最好的方法是什么？正则表达式是可能的解决方案吗？或者我需要编写一个javascript函数？我希望我能弄清楚如何编写一个类似上面的正则表达式，每隔n个字符插入一个文本，除非它在字符'＆lt;'之间和'＆gt;'。

感谢任何帮助。

Answer 1

这是我的解决方案。通常我不想使用jquery，但时间至关重要。

var el = $('<div>' + html + '</div>');
var allChildren = el.find('*');

allChildren.each(function() {
    for(var i = 0, len = this.childNodes.length; i < len; i++) {
        if(this.childNodes[i].nodeType === 3) {
            var newHtml = this.childNodes[i].nodeValue.replace(/(.{30})/g, '$1<wbr>');
            $(this.childNodes[i]).replaceWith(newHtml);
        }
    }
});

html = el.html();

Answer 2

你可以用这个：

(.{30}.*?\s)

工作正则表达式示例：

http://regex101.com/r/nL0qT2

使用Javascript：

var html = html.replace(/(.{30}.*?\s)/g, '$1<br />');

因此，这会在第30个字符后面的下一个空格中插入<br>标记，因此<br>不会插入任何单词或标记内。

如何在不在两个特定文本片段之间的每n个字符插入文本？

2 个答案: