javascript - 使用insertAdjacentHTML在元素前后插入html内容，为何未能包裹住该元素？-PHP Chinese Network Q&A

Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

javascript - 使用insertAdjacentHTML在元素前后插入html内容，为何未能包裹住该元素？

黄舟 2017-04-11 11:10:50

272

我想给一个元素增加一个a标签做它的父节点（用a标签包裹该元素），使用insertAdjacentHTML方法未能达到目标，求解是什么原因，以及如何解决？（浏览器chrome 55）

代码如下：

aaaaaaaaa

我想要的效果是：

aaaaaaaaa

结果出来的效果是：

aaaaaaaaa

我试过将a标签换成p、给p#a增加父元素等方法，均未有改变。求解

参考：
insertAdjacentHTML的文档

我之前在其他一些论坛看到用insertAdjacentHTML插入html片段的代码，现在我这样不行了，我猜测是不是现在浏览器里实现的insertAdjacentHTML必须是一个完整的元素（标签）了？不能再将元素拆分成两部分插入了？

黄舟

人生最曼妙的风景，竟是内心的淡定与从容！

reply all (2)

Ty802017-04-11 11:12:50 2 floor

文档写到插入的是生成的节点

insertAdjacentHTML() 将指定的文本解析为HTML或XML，并将生成的节点插入到指定位置的DOM树中。

jQuery可以用.wrap()方法

或者

function (toWrap, wrapper) { if (toWrap.nextSibling) { toWrap.parentNode.insertBefore(wrapper, toWrap.nextSibling) } else { toWrap.parentNode.appendChild(wrapper) } return wrapper.appendChild(toWrap) } wrap(document.querySelector("#a"), document.createElement('a'))