搜寻页面文档特定节点的三个方法 _Web前端

搜索页面文档特定节点的三个方法

? ? ? ?Document接口提供了如下三个方法：

? ?getElementById()：根据id值返回某个标记对应的DOM节点，不存在返回null。
? ?getElementsByTagName()：返回页面所有相同名称的标记对应的DOM对象，返回值为一个集合，不存在返回一个length为0的空集。
? ?getElementsByName()：返回具有相同name属性值的标记对应的节点。

	<div>1</div>
	<div>2</div>
	<div>3</div>
 </body>
 <script type="text/javascript">
	var d =document.getElementsByTagName("div");
	alert(d.length);  //3
	document.body.removeChild(d[2]);
	var d1 =document.getElementsByTagName("div");
	alert(d.length);   //2
	alert(d1.length);  //2 
	//d和d2都指向同一组DOM元素的集合
 </script>

??? ?Element接口也定义了getElementByTagName()方法，不过仅在当前节点包含的子节点中搜索，而不是在整个页面文档中搜索。

<script type="text/javascript">
	var d =document.getElementsByTagName("div");
	alert(d.length);  //0
</script>
</head>
<body>
	<div>1</div>
	<div>2</div>
	<div>3</div>
 </body>

?
?

? ? ? 要注意：页面上频繁使用getElementById()和getElementByTagName()事实上并不会降低页面效率，因为大多数浏览器都针对DOM进行了查询优化，预先准备了id和TagName的索引。不过这样一来，appendChild、removeChild和insertBefore以及对id的赋值操作反而会影响性能。