使用insertAdjacentHTML()添加部分HTML

时间:2018-11-16 00:18:52

标签: javascript jquery dom dom-manipulation insertadjacenthtml

我有一个很长的文本,用单个<p>标签包裹。像这样:

<p>
Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod...
</p>

我需要通过使用javascript或jquery将</p><p>插入文本的某些部分,将该文本分成较小的段落块,有效地结束最后一段,然后开始一个新的段落(我已经有一些javascript标识我要在其中插入新HTML的位置-效果很好)。我一直在使用insertAdjacentHTML()添加新的段落标签:

TheElmToInsertNextTo.insertAdjacentHTML('beforebegin','</p><p>');

问题是::浏览器试图修复我的部分html,并不断将其包装在其他<p>标签中,如下所示:

<p>
Lorem ipsum dolor
<p></p><p></p>
sit amet consectetur adipiscing elit sed do eiusmod...
</p>

结果是:额外的<p>标签破坏了我的分页脚本(来自easyPaginate),否则效果很好。

有没有更好的方法来插入部分HTML,而无需浏览器通过添加其他<p>标签来“修复”它? (该问题同时出现在Firefox和Chrome中)

1 个答案:

答案 0 :(得分:1)

感谢@Barmar指出,这不能按照我最初认为的顺序进行。我通过在将服务器上的数据加载到DOM中之前对其进行预处理来解决此问题。