如何使用Javascript将换行符添加到HTML中

时间:2015-07-14 09:20:38

标签: javascript html formatting

我正在使用数据源的网站上工作。在该数据源(通过CSV文件进入)中,有一段文本。客户端以项目符号格式输入文本,并希望它以这样的形式显示。例如:

  
      
  • 这里的第一点...... *第二点在这里...... *第三点在这里......
  •   

(客户端使用asterix表示所有点,这是文本编辑器,将第一个点转换为项目符号点)

有没有人知道我能在除第一个星号之外的所有内容之前插入换行符的方式,所以这看起来像一个列表?也许用一点点javascript?

理想情况下,列表如下所示:

  
      
  • 这里的第一点......
  •   
  • 第二点......
  •   
  • 第三点......
  •   

提前致谢,

汤姆

3 个答案:

答案 0 :(得分:2)

好吧我猜这里是你的问题和评论的混合物,但看起来好像你的列表中呈现的html会是这样的:

<ul>
    <li>First point here... * Second point here... * Third point here...</li>
</ul>

从您的评论中,看起来您正在使用jQuery,因此您可以执行以下操作:

$(function() {
    $('li').each(function() {
        var listItem = $(this),
            text =  listItem.text().replace(/\*/g, '<li>');

        listItem.html(text);
    });
});

Example

答案 1 :(得分:1)

使用正则表达式,您可以写:

input.replace(/\s\*/g, '\n&bull;');

这将用从新行开始的项目符号替换空格字符前面的所有*。

如果你需要从输入中创建一个真正的HTML标记(比如li标签),你将不得不深入挖掘regexp。这个MDN页面是一个很好的起点。

答案 2 :(得分:1)

结合您已有的答案,您可以使用正则表达式将星号替换为<li>。 E.g:

<强> HTML

<div id="output"></div>

<强>的Javascript

var str = ' * one * two * three';
str = str.replace(/\s\*/g, '<li>');
$('#output').html('<ul>'+str+'</ul>');

Jsfiddle