获取行间事件
提取事件
为元素添加事件
1、事件和其他属性一样，可以用JS添加
2、window.onload的意义
网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行，否则可能导致无法获取对象的情况，为了避免这种情况的发生，可以使用以下两种方式:
一.将脚本代码放在网页的底端，这样在运行脚本代码的时候，可以确保要操作的对象已经加载完成。
二.通过window.onload来执行脚本代码。
第一种方式感觉比较凌乱（其实推荐使用），往往我们需要将脚本代码放在一个更为合适的地方，那么window.onload方式就是一个良好的选择。window.onload是一个事件，当文档加载完成之后就会触发该事件，可以为此事件注册事件处理函数，并将要执行的脚本代码放在事件处理函数中，于是就可以避免获取不到对象的情况。
3、在做网页中我们要遵循：行为（JS）、样式(CSS)、结构(HTML)三者分离。
获取一组元素
getElementsByTagName
循环
if(条件){
语句
}
while(条件){
语句
}
var i=0; //1.初始化
while(i<5) //2.条件{
alert(i); //3.语句
//i=i+1; //4.自增
i++; //4.自增
}
for(初始化;条件;自增){
语句
}
for(var i=0;i<5;i++){
alert(i);
}
全选-不选-反选
checked选择
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>全选-不选-反选<title>
<script>
window.onload=function(){
var oBtn1=document.getElementById('btn1');
var oBtn2=document.getElementById('btn2');
var oBtn3=document.getElementById('btn3');
var oDiv=document.getElementById('div1');
var aCh=oDiv.getElementsByTagName('input');
oBtn1.onclick=function(){
for(var i=0; i<aCh.length;i++){
aCh[i].checked=true;
}
};
oBtn2.onclick=function(){
for(var i=0;i<aCh.length;i++){
aCh[i].checked=false;
}
};
oBtn3.onclick=function(){
for(var i=0;i<aCh.length;i++){
if(aCh[i].checked==true){
aCh[i].checked=false;
}
else{
aCh[i].checked=true
}
}
};
}
</script>
</head>
<body>
<input id="btn1" type="button" value="全选"/><br>
<input id="btn2" type="button" value="不选"/><br>
<input id="btn3" type="button" value="反选"/><br>
<div id="div1">
<input type="checkbox"/><br>
<input type="chsckbox"/><br>
<input type="checkbox"/><br>
<input type="checkbox"/><br>
<input type="checkbox"/><br>
</div>
</body>
</html>
网友评论