javascript第二课练习
2014-07-28 22:27
190 查看
<script type="text/javascript">
window.onload=function() //网页全部加载完后执行
{
var aDiv=document.getElementById('div1'); //获取ID
aDiv.onmouseover=zx; //当鼠标停留在div上执行此函数
};
function zx()
{
alert("测试OK");
}
</script>
<div id="div1">1231223</div>
/*-------------------------------------------*/
<script type="text/javascript"> window.onload=function() { var aDiv=document.getElementById("div1"); //获取DIV1,并给它命名 var aXc=document.getElementById('xc'); //获取xc,并给它命名 aDiv.onclick=function() //鼠标点击时时执行此函数 { if(aXc.style.display=="none") //如果是隐藏,将它显示,如果是显示,将它隐藏 { aXc.style.display="block"; } else { aXc.style.display="none" } } } </script>
<div id="div1">点击展开或者隐藏</div> <ul style="display:none;" id="xc"> <li>1</li> <li>2</li> <li>3</li> </ul>
/*-------------------------------------------*/
<script type="text/javascript"> window.onload=function() { var aDiv=document.getElementById("div1"); var ipt=document.getElementsByTagName('input'); aDiv.onclick=function() { // alert(aInput.length) //一共有多少个复选框 for(i=0;i<=ipt.length;i++) { ipt[i].checked=true; //循环全部为选中状态 } } } </script> <div id="div1">全选负选框</div> <input type='checkbox'/><br/> <input type='checkbox'/><br/>
/*-------------------------------------------*/
<style type="text/css"> input { background:#FFF; color:#FF0000; width:45px; height:35px; } .active { background:#000; color:#FFF; } </style> <script type="text/javascript"> window.onload=function() { var but=document.getElementsByTagName('input'); //获取页面中的input var i=0; for(i=0;i<but.length;i++) //循环下标,点击时候执行函数 { but[i].index=i; //找出他的索引下标
but[i].onclick=function() { for(i=0;i<but.length;i++) { but[i].className=""; //这个循环是为了把每个input 的 class为空掉! adiv[i].style.display="none"; //循环把所有的div都隐藏掉
} adiv[this.index].style.display="block"; //找到相对应的下标并显示
this.className='active'; //完了吧当前的重新赋于class } } } </script> <input class="active" type='button' value="1"> //默认第一个有class <input type='button' value="2"> <input type='button' value="3"><div style="display:block">111</div> //第一个默认为显示 <div>222</div> <div>333</div>
window.onload=function() //网页全部加载完后执行
{
var aDiv=document.getElementById('div1'); //获取ID
aDiv.onmouseover=zx; //当鼠标停留在div上执行此函数
};
function zx()
{
alert("测试OK");
}
</script>
<div id="div1">1231223</div>
/*-------------------------------------------*/
<script type="text/javascript"> window.onload=function() { var aDiv=document.getElementById("div1"); //获取DIV1,并给它命名 var aXc=document.getElementById('xc'); //获取xc,并给它命名 aDiv.onclick=function() //鼠标点击时时执行此函数 { if(aXc.style.display=="none") //如果是隐藏,将它显示,如果是显示,将它隐藏 { aXc.style.display="block"; } else { aXc.style.display="none" } } } </script>
<div id="div1">点击展开或者隐藏</div> <ul style="display:none;" id="xc"> <li>1</li> <li>2</li> <li>3</li> </ul>
/*-------------------------------------------*/
<script type="text/javascript"> window.onload=function() { var aDiv=document.getElementById("div1"); var ipt=document.getElementsByTagName('input'); aDiv.onclick=function() { // alert(aInput.length) //一共有多少个复选框 for(i=0;i<=ipt.length;i++) { ipt[i].checked=true; //循环全部为选中状态 } } } </script> <div id="div1">全选负选框</div> <input type='checkbox'/><br/> <input type='checkbox'/><br/>
/*-------------------------------------------*/
<style type="text/css"> input { background:#FFF; color:#FF0000; width:45px; height:35px; } .active { background:#000; color:#FFF; } </style> <script type="text/javascript"> window.onload=function() { var but=document.getElementsByTagName('input'); //获取页面中的input var i=0; for(i=0;i<but.length;i++) //循环下标,点击时候执行函数 { but[i].index=i; //找出他的索引下标
but[i].onclick=function() { for(i=0;i<but.length;i++) { but[i].className=""; //这个循环是为了把每个input 的 class为空掉! adiv[i].style.display="none"; //循环把所有的div都隐藏掉
} adiv[this.index].style.display="block"; //找到相对应的下标并显示
this.className='active'; //完了吧当前的重新赋于class } } } </script> <input class="active" type='button' value="1"> //默认第一个有class <input type='button' value="2"> <input type='button' value="3"><div style="display:block">111</div> //第一个默认为显示 <div>222</div> <div>333</div>
相关文章推荐
- JavaScript入门(八) - 第二阶段练习
- JavaScript进阶教程(第二课续)第1/2页
- 掌握Ajax 第二部分 使用 JavaScript 和 Ajax 发出异步请求
- JavaScript教程 - 第二部分 JavaScript 对象
- Ajax学习之第二部分 使用 JavaScript 和 Ajax 发出异步请求
- javascript数组练习
- Ajax 学习第二课-使用 JavaScript 和 Ajax 发出异步请求
- javascript 练习
- javascript 语法学习练习
- javascript 时间对象的练习
- javascript asp教程第二课--转义字符
- JavaScript进阶教程(第二课续)第1/2页
- 练习一下javascript,顺便给博客页面加个小玩意
- Javascript Checkbox全选练习
- JavaScript进阶教程(第二课)第1/3页
- JAVASCRIPT{精彩200例转自CSDN}===第二部份(转)
- JavaScript初级教程(第二课)第1/7页
- JavaScript进阶教程(第三课第二部分)第1/2页
- 开始练习写神乎其神的JAVASCRIPT
- A*算法学习 附Javascript 算法实现练习