JavaScript 使用insertBefore()在某元素的前/后加入元素

最新推荐文章于 2023-01-09 01:38:14 发布

thyyyyyyyy

最新推荐文章于 2023-01-09 01:38:14 发布

阅读量3.7k

点赞数 1

分类专栏：笔记 JavaScript

本文链接：https://blog.csdn.net/thyyyyyyyy/article/details/105870962

版权

笔记同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

JavaScript

3 篇文章 0 订阅

订阅专栏

定义和用法

insertBefore() 方法可以在您指定的已有子节点之前插入新的子节点

用此方法可以把文本插入到某段文本的前面或后面，而不是默认的插入到最后。

<!DOCTYPE html>
<html>
<body>
<p id="demo">这是节点0。<span>这是节点1。</span></p>

<button onclick="addText()">试一下</button>

<script>
function addText()
{
var newItem=document.createElement("div")//创建一个div节点
var textnode=document.createTextNode("Water")//创建一个文本节点
newItem.appendChild(textnode)//把文本节点加入到div节点里面

var demo=document.getElementById("demo")
demo.insertBefore(newItem,demo.childNodes[0]);//在第0个子节点之前插入这个节点，改变childNodes[]可以控制插入的文本的位置
}
</script>
</body>
</html>

thyyyyyyyy

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
JavaScript 使用insertBefore()在某元素的前/后加入元素

定义和用法insertBefore() 方法可以在您指定的已有子节点之前插入新的子节点用此方法把<!DOCTYPE html><html><body><p id="demo">这是节点0。<span>这是节点1。</span></p><button onclick="addText()"&gt...
复制链接

扫一扫