JavaScript insertAdjacentHTML（）的使用
寄义：insertAdjacentHTML() 将指定的文本剖析为HTML或XML，并将效果节点插入到DOM树中的指定位置。它不会重新剖析它正在使用的元素，因此它不会粉碎元素内的现有元素。这克制了额外的序列化步调，使其比直接innerHTML操纵更快。 用法：
1 element.insertAdjacentHTML(position, text);
名词表明：
1.element:目的元素；
2.insert:插入；
3.Adjacent: 与…毗连的; 相近的；
4.HTML:各人用的html结构；
text:一段字符串，此方法会将其剖析为节点对象，然后插入目的元素指定位置；
positon:规定被插入的位置的关键字；
position有四个参数选项：
1.beforebegin:规定在目的元素的外部开始位置插入。
2.afterbegin:规定在目的元素的内部开始位置插入。
3.beforeend:规定在目的元素的内部竣事位置插入。
4.afterend:规定在目的元素的外部竣事位置插入。
弄个图会更清楚点：
重点留意：该方法会将指定的文本剖析为HTML或XML（也就是说标签会被剖析）
实例：
123 4 5 6 7 #bluerec { 8 width:200px; 9 height:150px;10 background-color:blue;11 }12 p {13 width:100px;14 height:80px;15 background-color:red;16 }17 18 19 20
21 22
23
24 25 26 36 37
现实效果：
对上述代码的剖析：
1.初始状态：一条分割线、蓝色div、按钮
2.点击按钮后：在蓝色div上插入了p标签，代替了分割线的位置，分割线位置上移
使用场景：必要在原有元素附近追加元素时，比起innerHTML服从更高，兼容性更好
页:
[1]