如何将未包装的字符串包裹在HTML标签中

Question

// From
var first = 'Text here <code>var first = "first";</code> Another text 
<code>var second = "second";</code>'
// To 
var second =  '<p>Text here</p> <code>var first = "first";</code> 
<p>Another text</p> <code>var second = "second";</code>'

我收到一个类似"来自"的字符串，我需要将其解析为第二个示例，是否有这样做？

Answer 1

创建一个元素，将字符串放入元素中，然后迭代子节点，然后用包含关联文本的新<p>替换文本节点。然后最终获得结果html

// From
var first = `Text here <code>var first = "first";</code> Another text 
<code>var second = "second";</code>`
var div = document.createElement('div');
div.innerHTML = first;
var nodes = div.childNodes;
for (var i = 0; i < nodes.length; i++) {
  if (nodes[i].nodeType == 3) {
    var p = document.createElement('p');
    p.textContent = nodes[i].textContent;
    div.replaceChild(p, nodes[i])
  }
}
let res = div.innerHTML;
console.log(res)