原生js追加html到指定元素节点,类似jquery的append方法

HTML代码

<div id="message">
    <!--js插入内容到这里 -->
</div>

JS代码

var str = '<p>这是一段文字</p>';
document.getElementById("message").insertAdjacentHTML('beforeend', str);

insertAdjacentHTML 用法说明

element.insertAdjacentHTML(position, text); 

position 是相对于 element 元素的位置,位置参数如下:

beforebegin:在 element 元素的前面。(同级)
afterbegin:在 element 元素的第一个子节点前面。(子级)
beforeend:在 element 元素的最后一个子节点后面。 (子级)
afterend:在 element 元素的后面。(同级)

发表评论