JS insertBefore(),插入DOM节点
insertBefore()方法
JavaScript中的insertBefor()方法,可以在调用对象中的某一个子节点之前插入一个DOM节点。
语法
parentNode.insertBefore(insertNode, childNode)
提示:parentNode为父节点,insertNode参数为需要插入的子节点,childNode为parentNode的子节点,insertNode即将插入到childNode之前。
insertBefore()实例代码,及在线编辑器
点击下方实例中的按钮,将在段落1前面添加一个文本节点(在这之前,需要先创建一个文本节点):
<div id='d'>
<p id='p'>段落1</p>
<p>段落2</p>
</div>
<button onclick='setTextNode()'>点击添加文本节点</button>
<script>
function setTextNode(){
var p = document.getElementById('p');
var textNode = document.createTextNode('这是文本节点')
var d = document.getElementById('d')
d.insertBefore(textNode, p)
}
</script>