<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> </style> </head> <body> <div> <h1>我是标题</h1> <p>我是段落</p> </div> <script type="text/javascript"> //创建节点 let qq=document.createElement("span");//创建span标签 //console.log(qq);//输出span标签 //console.log(typeof qq);//看span标签耳朵类型 //添加节点 let ww=document.querySelector("div");//创建div标签 //console.log(ww.appendChild(qq));//把span标签放到div标签的最后面 let ee=document.createElement("a");//创建a标签 //console.log(ww.appendChild(ee));//把a标签放到div标签的最后面 //插入节点 let aa=document.createElement("span"); let ss=document.querySelector("div"); let dd=document.querySelector("h1"); let ff=document.querySelector("p"); //console.log(ss.insertBefore(aa,dd)); //在div中,把span插入到h1的前面 //console.log(ss.insertBefore(aa,ff)); //在div中把span插入到p的前面*/ //删除节点 // 注意点: 在js中如果想要删除某一个元素, 只能通过对应的父元素来删除 // 元素是不能够自杀的 // console.log(aa.parentNode);//获取span的父节点div. // console.log(aa.parentNode.removeChild(aa));//删除掉div的span // console.log(ss.parentNode.removeChild(ss)); // //删除div,通过body来实现 // 5.克隆节点 let oDiv = document.querySelector("div"); console.log(oDiv.cloneNode()); let x=oDiv.cloneNode(true); console.log(x); </script> </body> </html>
dom啦4 Node增删改查
关注
打赏