<p>我的目标是将重叠的位置拆分以在HTML中使用。例如，我有这段文本：</p> <blockquote> <p>一 二 三</p> </blockquote> <p>我想让第二个和第三个单词加粗，并让前两个单词斜体。我们得到了这样的结果：</p> <pre class="brush:php;toolbar:false;">[ { "start": 4, "end": 13, "markup": "BOLD" }, { "start": 0, "end": 7, "markup": "ITALIC" } ]</pre> <p>如果我们希望按位置应用HTML标记，我们得到了这样的结果：</p> <pre class="brush:php;toolbar:false;">&lt;bold&gt;一 &lt;em&gt;二&lt;/bold&gt; 三&lt;/em&gt;</pre> <p>看到重叠了吗？<code>&lt;em&gt;</code>开标签被<code>&lt;/bold&gt;</code>闭标签打断了。应该是这样的：</p> <pre class="brush:php;toolbar:false;">&lt;bold&gt;一 &lt;em&gt;二&lt;/em&gt;&lt;/bold&gt;&lt;em&gt; 三&lt;/em&gt;</pre> <p>以及位置：</p> <pre class="brush:php;toolbar:false;">[ { "start": 4, "end": 7, "markup": "BOLD" }, { "start": 7, "end": 13, "markup": "BOLD" }, { "start": 0, "end": 7, "markup": "ITALIC" } ]</pre> <p>P.S. 不要在应用标记后担心原始位置发生变化。我写了一个好的解决方案。</p> <p>我尝试实现一些解决方案，但对我来说似乎是一项艰巨的任务。</p>

const res = (new DOMParser())
    .parseFromString(
        "<bold>One <em>two</bold> three</em>",
        "text/html"
    );
console.log(res.body.innerHTML)