必会示例:
- i的问题
- qq头像完整版
- this的错误用法
- 按住鼠标连续加减
- 封闭空间
- 甲乙的问题
- 京东轮播图
- 苏宁延迟选项卡
- 无限下拉菜单
- 淘宝短发送倒计时
1、必须会的
选项卡、按钮控制的选项卡、自动播放选项卡、数字时钟、图片时钟。
2、定时器中不能使用this.因为this变成了window对象,window就是浏览器对象。
3、定时发送功能
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="智能社 - zhinengshe.com"> <meta name="copyright" content="智能社 - zhinengshe.com"> <title>智能社 - www.zhinengshe.com</title> <style> </style> <script> window.onload=function(){ var oBtn = document.getElementsByTagName('input')[0]; var s = 5+1; var timer = null; oBtn.onclick=function(){ function countDown(){ oBtn.disabled=true; s--; oBtn.value='正在发送('+s+')'; if(s<0){ clearInterval(timer); oBtn.value='重新发送'; oBtn.disabled=false; s=5+1; } } countDown(); timer = setInterval(countDown,1000); }; }; </script> </head> <body> <input type="button" value="免费获取验证码" /> </body> </html>
4、定时器不稳定,数值越小越不稳定。
5、i的问题
循环中加事件、事件中不能使用i....
why?
1、点击触发事件时循环已经完事了。
2、变量的值不会自己改变。
3、当循环跑完的时候i已经变成了元素的长度。
解决办法:
1、添加自定义属性。循环中abn[i].index=i;
2、自执行函数
循环中加定时器,定时器中使用i,弹了n个length
6、甲乙的问题,变量命名冲突解决办法
变量名冲突。 关于函数执行。 <script> window.onload=function(){ (function (){ var oBtn= document.getElementById('btn1'); oBtn.onclick=function(){ alert(oBtn.value); }; })(); (function(){ var oBtn= document.getElementById('btn2'); oBtn.onclick=function(){ alert(oBtn.value); }; })(); }; </script>
7、
关于括号的问题
封闭空间
(function(){
语句;
})();// 为了 防止报错
作用1:解决了变量名冲突的问题。
函数调用几次就执行几次。调用几次就复制了几份。
作用2:解决i的问题。
好处:省了一个名字。