20.创建和插入节点

发布时间 2023-09-28 20:53:18作者: 一名狗书匠&

创建和插入节点:
获得某个DOM节点,假如这个DOM节点是空的,可以通过innerHTML增加一个元素,但是如果这个DOM节点已经有
元素了,那就不能听过innerHTML来新增元素,这样会覆盖原来的元素
appendChild 追加元素
父级名字.appendChild(要追加的元素名字);

document.createElement(‘ p ’) 创建一个p标签
p.id=‘ppp’ 给p标签添加id
p.innerText=‘你好,岳不群’ 给p标签添加文字
父类标签.appendChild('p'); 给一个标签的下方追加这个p标签

document.createElement('script ') 创建一个script标签
script.id='script' 给script标签添加一个id
script.setAttribute('type','text/javascript'); 给script标签添加一个type=‘text/javascript’ 的属性
父类标签.appendChild('script'); 给一个父类元素下方追加这个标签

利用js给body标签添加css属性:
var style=document.createElement('style'); 创建一个style标签
style.innerHTML='body{background:yellow}'; 添加一个属性
head.appendChild(style); 把style标签添加到head下面

插入节点:
var ee=document.getElementById('ee'); 获取ee节点
var se=document.getElementById('se'); 获取se节点
var fuqin=document.getElementById('fuqin'); 获取fuqin节点
fuqin.insertBefore(se,ee); 以fuqin为标准 在ee前面插入se