我可以使用javascript在每隔一行插入一些字符串吗？

Let's say I have a large wall of text that I've pasted onto my page inside a div with id "story". Each paragraph is actually on a single line in the html file, and each paragraph is separated by a single line. I want to make the wall of text more readable using bootstrap. I've set the css in a blog like format, is there any way to dynamically add  at every paragraph separation?

假设我有一大段文字,我已经粘贴到ID为“story”的div中的页面上。每个段落实际上都在html文件中的一行上,每个段落由一行分隔。我想使用bootstrap使文本墙更具可读性。我已经将css设置为博客格式,有没有办法在每个段落分离时动态添加

2 个解决方案

#1

var paragraphs = "your text".split(/\n\s*\n/);//since paragraphs are separated by
for(var i = 0; i < paragraphs.length; i++){   //a line, we need two \n here.
    var p = document.createElement("p");
    p.innerHTML = paragraphs[i].trim();
    document.querySelector("#story").appendChild(p);
}

//==============
//To get the text of an element (with new lines), you can do this:
document.querySelector("#story").childNodes[0].wholeText;

Maybe something like this? http://jsfiddle.net/DerekL/qv2GZ/

也许是这样的? http://jsfiddle.net/DerekL/qv2GZ/

What you shouldn't do is replacing text inside a string and dumping it right into DOM. That's bad practice. That's why here I'm creating a p element instead of replace lines with .

你不应该做的是替换字符串中的文本并将其直接转储到DOM中。这是不好的做法。这就是为什么我在这里创建一个p元素而不是用

替换行。

#2

I think that you should take a look here: How do I replace all line breaks in a string with tags?

我想你应该看一下:如何用
标签替换字符串中的所有换行符?

And here: How to replace all occurrences of a string in JavaScript?

在这里:如何在JavaScript中替换所有出现的字符串?

Remember that new line is simply \n. Then it is a matter of simple string replace. There is a huge research about it, and the question is a possible duplicate, so I think that is enough to answer :).

请记住,新行只是\ n。然后是简单的字符串替换问题。有一个关于它的大量研究,问题是可能重复,所以我认为这足以回答:)。

Best regards!

#1

var paragraphs = "your text".split(/\n\s*\n/);//since paragraphs are separated by
for(var i = 0; i < paragraphs.length; i++){   //a line, we need two \n here.
    var p = document.createElement("p");
    p.innerHTML = paragraphs[i].trim();
    document.querySelector("#story").appendChild(p);
}

//==============
//To get the text of an element (with new lines), you can do this:
document.querySelector("#story").childNodes[0].wholeText;