在JavaScript中，添加和删除DOM（文档对象模型）元素是常见的操作。以下是一些基本的方法来添加和删除HTML元素：
添加元素
1.使用 document.createElement() 和 appendChild()
你可以创建一个新的元素，然后将其添加到DOM树中。
javascript// 创建一个新的 <p> 元素 var newParagraph = document.createElement("p"); // 创建一个文本节点 var textNode = document.createTextNode("这是一个新的段落。"); // 将文本节点添加到 <p> 元素中 newParagraph.appendChild(textNode); // 将 <p> 元素添加到文档的 <body> 中 document.body.appendChild(newParagraph);
2.使用 innerHTML
你可以直接修改元素的 innerHTML 属性来添加新的HTML内容。
javascript// 获取一个已存在的元素 var existingElement = document.getElementById("someElementId"); // 添加新的HTML内容 existingElement.innerHTML += "<p>这是一个新的段落。</p>";
删除元素
1.使用 removeChild()
你可以通过父元素来删除一个子元素。
javascript// 获取要删除的元素 var elementToRemove = document.getElementById("elementIdToRemove"); // 获取该元素的父元素 var parentElement = elementToRemove.parentNode; // 从父元素中删除该元素 parentElement.removeChild(elementToRemove);
2.使用 innerHTML 清空内容
虽然这不是真正地“删除”元素，但你可以通过设置 innerHTML 为空字符串来移除元素内的所有内容。
javascript// 获取一个已存在的元素 var existingElement = document.getElementById("someElementId"); // 清空元素的内容 existingElement.innerHTML = "";
