javascript中的document对象

javascript中的document对象

1. document对象的概念
   浏览器对外提供的支持js的用来操作HTML文档的一个对象，此对象封存的HTML文档的所有信息。
2. 使用document获取HTML元素对象

• 直接获取方式：
  通过id
  通过name属性值
  通过标签名
  通过class属性值
• 间接获取方式：
  父子关系
  子父关系
  兄弟关系

		<script type="text/javascript">
				//document获取元素对象
					//直接方式
						//id方式
						function testGetEleById(){
							var inp=window.document.getElementById("uname");
							alert(inp);
						}	
						//name方式
						function testGetEleByName(){
							var favs=document.getElementsByName("fav");
							alert(favs);
						}	
						//标签名
						function testGetEleByTagName(){
							var inps=document.getElementsByTagName("input");
							alert(inps);
						}
						//class属性
						function testGetEleByClassName(){
							var inps=document.getElementsByClassName("common");
							alert(inps.length);
						}
					//间接获取方式
						//父子关系
							function testParent(){
								//获取父级元素对象
								var showdiv=document.getElementById("showdiv");
								//获取所有的子元素对象数组
								var childs=showdiv.childNodes;
								alert(childs.length);
							}
						//子父关系
							function testChild(){
								//获取子元素对象
									var inp=document.getElementById("inp");
									var div=inp.parentNode;
									alert(div);
							}
						//兄弟关系
							function testBrother(){
								
									var inp=document.getElementById("inp");
									var preEle= inp.previousSibling;//弟获取兄
									var nextEle=inp.nextSibling;//兄获取弟
									alert(preEle+":::"+nextEle);
								
							}
						
		</script>