JavaScript(二) DOM

当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）通过 HTML DOM，可访问 JavaScript HTML 文档的所有元素。

通过 id 查找 HTML 元素:getElementById 这里大小写敏感,而且不像VS报错提示性能那么好,所以写JavaScript成功后有些许的成就感..

如果您需要操作某个特定的元素，使用 getElementById() 方法:

getElementById 是在一个标签或者一个范围内,根据标签名选择,如果要选择第3个 input 那么 var t=getElementById("input")[2].

<html>
<head>
<script type="text/javascript">
function getElements()
  {
  var x=document.getElementsByTagName("input")[2];
  alert(x.value);
  }
</script>
</head>
<body>

<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input type="button" onClick="getElements()"
value="How many input elements?" />

</body>
</html>

docunment.getElementById("id")；根据id找，最多找一个
var a =docunment.getElementById("id");
docunment.getElementByName("name")；根据name找，找出来的是数组
docunment.getElementByTagName("name")；根据标签名找，找出来的是数组
docunment.getElementByClassName("name") 根据classname找，找出来的是数组

既然是数组,那么要选某一个就在后面加[] 从0开始例:docunment.getElementByName("name")[5] 意思是根据name找出来的第6个.

______________________________________________华丽丽的分割线______________________________________________

对事件作出反应

我们可以在事件发生时执行 JavaScript，比如当用户在 HTML 元素上点击时。

如需在用户点击某个元素时执行代码，请向一个 HTML 事件属性添加 JavaScript 代码：

onclick=JavaScript       onclick事件

也可以这样

onclick事件:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>无标题文档</title>
<script>
function changetext(id)
{
id.innerHTML="谢谢!";
}
</script>
</head>
<body>
<h1 onclick="changetext(this)">请点击该文本</h1>
</body>

鼠标悬停:

<body>
<div onmouseover="mOver(this)" onmouseout="mOut(this)" style="background-color:green;120px;height:20px;padding:40px;color:#ffffff;">把鼠标移到上面</div>
<script>
function mOver(obj)
{
obj.innerHTML="呵呵"
}
function mOut(obj)
{
obj.innerHTML="来点我"
}
</script>
</body>

Onchange事件:

<head>
<script>
function myFunction()
{
var x=document.getElementById("fname");
x.value=x.value.toUpperCase();
}
</script>
</head>
<body>
请输入英文字符：<input type="text" id="fname" onchange="myFunction()">
<p>当您离开输入字段时，会触发将输入文本转换为大写的函数。</p>
</body>