创建新的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>