document对象
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div></div>
<div id="text" style="width:200px; heigth:200px;">
<span>hello</span>
</div>
<div class="text"></div>
<span class="text"></span>
<input type="text" name="uid" id="uid" value="hello"/>
</body>
<script type="text/javascript">
//1.找元素
/*var a=document.getElementById("text");//根据ID找，只能找到一个
alert(a);*/
/*var a=document.getElementsByClassName("text");//根据class名找，可以找到多个，返回数组
alert(a[1]);*/
/*var a=document.getElementsByTagName("div");//根据标签名找，可以找到多个，返回数组
alert(a);*/
/*var a=document.getElementsByName("uid");//根据name找，可以找到多个，返回数组
alert(a[0]);*/
//复杂查找
//var a=document.getElementById("text");
//alert(a.childNodes[4]); //找该元素下的子元素
//alert(a.parentNode); //找到该元素的父级元素
//alert(a.previousSibling); //找到同级上面的元素
//alert(a.nextSibling); //找到同级下面的元素
//2.控制元素
//var a=document.getElementById("text")
//a.remove(); //移除元素 源代码还在
//var s=document.createElement("span"); //创建元素
//a.appendChild(s); //追加子元素
//3.操作元素的内容
//普通元素
//var a=document.getElementById("text");
//alert(a.innerText); //取元素的文本内容
//a.innerText="world";给元素赋文本值
//alert(a.innerHTML); //取元素的HTML代码内容
//a.innerHTML="<b>加粗</b>"; //给元素扔一个HTML代码
//表单元素
//var a=document.getElementById("uid");
//a.value="用户名"; //给元素赋值
//alert(a.value); //取值
//4.操作元素属性
//var a=document.getElementById("text");
//a.setAttribute("bs","100"); //添加属性
//alert(a.getAttribute("bs")); //获取属性值
//a.removeAttribute("bs"); //移除属性
//5.操作元素样式
//var a=document.getElementById("text");
//a.style.backgroundColor="red"; //设置样式
//alert(a.style.width); //获取样式，只能是内联的
a.style.width=""; //移除样式
</script>
</html>
