HTML-Collection/NodeList

	# html-collection
	用于向文章中添加或修改内容,使用document.getElements  
	ByTagName("标签名称")得到的返回值为Collection对象,  
	Collection对象类似于数组,可以通过下标的方式来对可操  
	做的目标进行修改或添加。  
	例:
	有如下html代码  
	<!DOCTYPE HTML>
	<html>
	<head>
	<meta charset="utf-8">
	<title>test</title>
	</head>
	<body>
	<p>第一天</p>
	<p>第二天</p>
	<p id="demo"></p>
	<script>
	var x = document.getElementsByTagName("p");
	document.getElementById("demo").innerHTML="第二个段落通过Collection对象访问结果为:<span style='color:red;'>"+x[1].innerHTML + '</span>';
	</script>
	</body>  
	</html>  
	  
	  Collection对象虽然比较像数组,但其和数组有很多的不同,例如:  
	  valueof().pop().push()/joim()等方法。

	#NodeList
	在老版的浏览器中,使用getElementByClassName得到的返回值是NodeList  
	类型,而不是Collection对象。  
	所有浏览器的 childNodes 属性返回的是 NodeList 对象。
    大部分浏览器的 querySelectorAll() 返回 NodeList 对象。  
    通过document.querySelectorAll("标签名")得到的返回值为NodeList对象  
    NodeList也可以像数组一样,利用下标的方式来对节点进行访问。  
    NodeList利用循环方式来访问:  
    var y = document.querySeletorAll("p");
    var x;
    for(x = 0;x < y.length;x++)
    {  
    		y[i].backgroundColor="red";		
    }
      
    还有其他的遍历方式,类似于java中的增强for循环。  
      
     Collection和NodeList有所相同也有所不用,  
     Collection和NodeList都可使用下标的方式来进行访问。
     但Collection会随着html页面的更新进行变化  
     NodeList不会进行变化,会得到固定值。  
          加油加油!!!
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值