Javascript 删除div中的空行

我有一个标签：

<pre>
     this is a

    this is b


       this is c
</pre>

我想要的是：

<div>this is a</div>
<div>this is b</div>
<div>this is c</div>

有没有办法只使用客户端方法来执行此操作

将

标记更改为

？但它变成了单线，不是我想要的

<p>
 this is a<br/>
 this is b<br/>
 this is c<br/>
</p>

添加css？我没有找到一种风格来实现

还是使用javascript

---

PS：标签中的内容是由液体模板

{{post.content}}

生成的，它是不可变的

修剪并过滤掉空行

//获取pre标记
var pre=document.querySelector（'pre'）；
pre.innerHTML=pre.innerHTML
//按新行拆分
.split（“\n”）
//迭代和修剪
.地图（功能（五）{
返回v.trim（）
//过滤掉非空字符串
}).过滤器（功能（v）{
返回v！=''；
//使用换行符连接
}).join（'\n'）

这是一个
这是b
这是c

不要使用“pre”标记。使用简单

这是一个
这是b
这是c

我希望这有帮助 这是一个
这是b
这是c

使用HTML，您可以做到这一点！

---

HTML中的Pre-tag打印时不带换行符，也不带空格。

您使用的是

Pre-tag

，它表示预格式化文本，此标记之间包含的任何内容，无论是

空格

还是

换行符

，输出都将与包含的内容相同

HTML元素表示预先格式化的文本。本文件中的文本 元素通常以非比例（“单空间”）显示 字体与文件中的布局完全相同。这里面有空格 元素显示为已键入

因此，您可以使用其他标记，但仍然可以使用Pranav C Balan添加的

JavaScript

删除这些句子之间的空格

Hi-xyz演示文本。Hi-xyz演示文本。
嗨，xyz演示文本。
嗨，xyz演示文本。

<div>this is a</div>
<div>this is b</div>
<div>this is c</div>

<p>
 this is a<br/>
 this is b<br/>
 this is c<br/>
</p>