js添加、移除、移动、复制、创建节点

最新推荐文章于 2024-09-25 09:33:21 发布

木木格里

最新推荐文章于 2024-09-25 09:33:21 发布

阅读量866

点赞数

CC 4.0 BY-SA版权

分类专栏： js 文章标签： javascript

本文链接：https://blog.youkuaiyun.com/qq_36545656/article/details/54947292

js 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了如何使用JavaScript操作DOM，包括向body中添加文本节点，以及探讨删除、移动和复制节点的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、添加节点append方法
例子：为body添加一个内容为sss的文本节点
document.body.appendChild(document.createTextNode("sss"));
2、移除节点，removeChild移除某个节点的子节点
例子：

var ccn=document.getElementById("sd").childNodes[0];//获取到要移除的节点
    document.getElementById("sd").removeChild(ccn);//将id为sd的第一个子节点移除
3、移动，控制节点 
例子：将id为sd的节点向右边移动50px

var sdds=document.getElementById("sd");
sdd.style.background='blue';

    sdds.style.left=parseInt(sdds.style.left)+50+"px";
<div id='sd' style="position: absolute; left: 10px;">sd</div>
4、创建节点
document.createTextNode("sss")//创建文本节点
document.createElement("p")//创建p节点
p.innerText = 'ppppp';
sdds.appendChild(p);
5、查找节点
document.getElementById('oo');//根据id查找
document.getElementByClassName('dd')[0];

document.getElementsByTagName("p")[0];//根据标签名字查找节点