javascript之DOM更新操作

张开发
2026/4/16 1:12:12 15 分钟阅读

分享文章

javascript之DOM更新操作
创建一个节点语法document.createElement(html标签)//创建一个节点,要添加一个li标签 let adocument.createElement(li) //在li标签里面添加“li4”文本 a.innerHTMLli4创建一个文本节点语法document.createTextNode(文本内容)//创建一个文本节点,比如li4 let b document.createTextNode(li4) //创建一个节点,比如li标签 let a document.createElement(li) //将文本节点添加到节点 a.appendChild(b)将一个节点添加到节点中子节点末尾语法 node.appendChild(newNode)ul idmyul li idfirstli1/li li idsecondli2/li lili3/li /ul比如说要添加一个li标签//创建一个节点,要添加一个li标签 let adocument.createElement(li) //在li标签里面添加“li4”文本 a.innerHTMLli4 //获取节点 let myuldocument.getElementById(myul) //添加节点内容 myul.appendChild(a)将一个节点添加到节点的某一个子节点之前语法node.insertBefore(newNode,refNode)还是上面的html代码需要在类是second之前插入li标签//获取节点 let myuldocument.getElementById(myul) //设置要添加的节点及内容 let adocument.createElement(li) a.innerHTMLli4 //在second之前添加节点a myul.insertBefore(a,document.getElementById(second))更新节点node.replaceChild(newNode,refNode)比如要更新上面html的类名是second节点//获取节点 let myuldocument.getElementById(myul) //设置要准备替换的节点及内容 let adocument.createElement(li) a.innerHTMLli4 //开始进行节点内容更新 myul.replaceChild(a,document.getElementById(second))删除节点中某个子节点node.removeChild(refNode)比如要删除上面html中second节点let myuldocument.getElementById(myul) //删除子节点 myul.removeChild(document.getElementById(second))删除某个节点node.remove()document.getElementById(second).remove()

更多文章