javascript删除html结点操作

来源：互联网发布：网络优化大师下载编辑：程序博客网时间：2024/05/16 19:05

html页面上删除结点的操作跟添加结点中将段落添加在指定依附点之前相似，将段落添加在指定依附点之前代码为document.body.insertBefore(newGraf, docForm),删除的为document.body.removeChild(deleteNode)就可以了。使用的是removeChild方法，删除的是body域里面的元素。

看个代码介绍一下吧。

假如有下面一段代码，内容有四段。

<html><head><title>Deleting Nodes</title></head><body><p>给你一张过去的CD，听听那时我们的爱情，有时会突然忘了，我还在爱着你</p><p>再唱不出那样的歌曲，听到都会红着脸躲避，虽然会经常忘了，我依然爱着你</p><p>因为爱情，不会轻易悲伤，所以一切都是幸福的模样</p><p>因为爱情，简单的生长，依然随时都能为你疯狂</p><input type="button" onclick="deleteNodes()" value="delete Nodes"/><script>function deleteNodes() {}</script></body></html>

现在要删除段落内容，该如何实现deleteNodes方法呢？

很简单，两行代码搞定。

      var deleteNode =document.getElementsByTagName("p")[0];      document.body.removeChild(deleteNode);

var deleteNode =document.getElementsByTagName("p")[0];

获取到要删除的段落内容，document.getElementsByTagName("p")[0]为body标签域内的第一个p 标签内容。

document.body.removeChild(deleteNode);

将获取到的要删除的节点信息从页面上面删除，使用removeChild方法。

如果段落有id的话，那就可以直接使用getElementById 方法来指定的获取要删除的对象，不用再使用 getElementsByTagName 方法获取到对象集合，再通过数组下标来指定删除对象了。

我们的示例中删除的是document.getElementsByTagName("p")[0]，也可以删除其他段落，比如document.getElementsByTagName("p")[3] 等真实存在的段落信息。

0 0