DOM中访问 HTML 元素(节点)的方法

访问元素(节点)的方法:
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>DOM</title>
	</head>
	<body>
		<div id="nav">今天真是个睡觉的好日子</div>
		<ul>
			<li class="active">1</li>
			<li>2</li>
			<li class="active">3</li>
			<li>4</li>
		</ul>
		<input type="radio" name='sex' value="1"><input type="radio" name='sex' value="0"></body>
</html>

其中有三个元素html、head、body不需要找,分别可以直接用表示:

<script>
	var html = document.documentElement;  	
	var head = document.head;  
	var body = document.body;   
</script>        
getElementById() 方法

只能通过document调用
getElementById() 方法返回带有指定 id 的元素:


	<script>
		var box = document.getElementById("nav"); 
	</script>

getElementsByTagName() 方法

定义在Document.prototype和Element.prototypes上
getElementsByTagName() 返回带有指定标签名的所有元素,查找的是一个子元素对象集合


	<script>
		var oLi = document.getElementsByTagName("li"); //HTMLCollection(4) [li, li, li, li]
	</script>

getElementsByClassName() 方法

getElementsByClassName() 在 Internet Explorer 5,6,7,8 中无效。
返回带有指定 calss属性的元素对象


	<script>
		var oLi = document.getElementsByClassName("active"); //HTMLCollection(2) [li.active, li.active]
	</script>
getElementsByName() 方法

getElementsByClassName() 在 Internet Explorer 5,6,7,8 中无效。
返回带有指定 name属性的元素对象

<script>
	var sex = document.getElementsByName("sex"); //NodeList(2) [input, input]
</script>

你可能感兴趣的:(DOM中访问 HTML 元素(节点)的方法)