不确定（因为在问题中缺失）输入和所需输出是什么，但是
将.replace()与以下正则表达式配合使用，该正则表达式捕获匹配组并将其插入到DIV中：

const elPre = document.querySelector("pre");
elPre.innerHTML = elPre.textContent.replace(/^([^\n\n]+)/, "<div>$1</div>");

pre div { background: gold; padding: 1rem; }

<pre id="test">Lorem ipsum dolor sit amet

consectetur adipisicing elit. Reprehenderit ullam vitae, quisquam molestias.

Fugit eaque officiis aspernatur voluptatum, rem quod minus temporibus
inventore obcaecati repellat nostrum tenetur blanditiis veniam.</pre>

或者，下面是使用拆分和连接的示例
一个一个三个一个一个一个一个一个四个一个一个一个一个一个五个一个

你不需要正则表达式--你可以简单地用你的结束标记</div>来替换换行符。也就是说，我认为这是一个非常奇怪的页面布局方法，我怀疑这真的是你应该做的。

var preElement = document.querySelector("pre");
var html = '<div>' + preElement.innerHTML.replace("\n\n", "</div>");
preElement.innerHTML = html;

div {
  border: 1px solid #ccc;
  padding: 5px;
  background: #ddd;
}

<pre>Sed ut perspiciatis unde omnis

iste natus error sit voluptatem accusantium doloremque laudantium
</pre>