我认为动态的网页中,对于元素的删除,和添加时非常的有用的。那么我们应该怎样通过代码来动态的添加和删除元素。在这个地方我们就来说一下对于元素的删除和添加需要用到的代码。
首先我们添加代码之前应该首先是创建一个代码
var para=document.createElement("p");//这个地方是创建一个p元素,并且是赋值给一个变量。
然后我们需要做的是向p元素添加文本:
var node=document.createTextNode("这个是一个段落");
但是都这个地方我们创建元素和文本节点之间兵没有关系,下面就是让他们之间产生关系,也即是
向<p>元素追加文本节点
para.appendChild(node);
最后我们需要做的是向已有的元素追加这个元素
var element=document.getElementById("div1");
然后将上面创建的元素添加到已经存在的元素上面
element.appendChild("para");
这样就完成了向网页中添加元素。
我们也可以删除元素
首选是找到要删除的元素的父元素
var parent=document.getElementById("div1");
然后找到要删除的元素
parent.removeChild(child);
这样就完成了元素的删除。
<!-- html添加元素,和删除元素 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="div1">
<p id="p1">这个是个段落</p>
<p id="p2">这个是另外的一个段落</p>
</div>
<script type="text/javascript">
var para=document.createElement("p");
var node=document.createTextNode("这个是一个新的段落");
para.appendChild(node);