javascript删除html结点操作


    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" οnclick="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] 等真实存在的段落信息。


  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值