创建新的HTML元素——向 HTML DOM 添加新元素,必须首先创建该元素(元素节点),然后向一个已存在的元素追加该元素
<!doctype html> <html> <head> <meta charset="utf-8"> <title>JavaScript</title> </head> <body> <div id="div1"> <p id="p1">这是一个段落</p> <p id="p2">这是另一个段落</p> </div> <script> function myClick(){ var para=document.createElement("p"); var node=document.createTextNode("这是一个新段落"); para.appendChild(node); var element=document.getElementById("div1"); element.appendChild(para); } </script> <button onClick="myClick()">点击这里</button> </body> </html>
删除HTML元素——必须首先找出要删除元素的父元素,然后才能删除指定节点
<!doctype html> <html> <head> <meta charset="utf-8"> <title>JavaScript</title> </head> <body> <div id="div1"> <p id="p1">这是一个段落</p> <p id="p2">这是另一个段落</p> </div> <script> function myClick(){ //var parent=document.getElementById("div1"); var child=document.getElementById("p1"); //parent.removeChild(child); child.parentNode.removeChild(child);//上面两行可以用当前代码替换 } </script> <button onClick="myClick()">删除节点</button> </body> </html>