标签：
短信发送验证倒计时案例（常用）
关闭定时器clearInterval
this 指向的是 事件的调用者 ，或者是函数的使用者。
button 不可以用 disabled 不可用的意思 意思是变成灰色不能按。
btn.disabled = “disabled” || btn.disabled = true;
因为 button是个双标签 所以要更改他的内容， 需要使用 innerHTML ，而不是value。
一般情况下，我们喜欢 var that = this;
<script>
window.onload = function(){
var btn = document.getElementById("btn");
var count = 5;
var timer = null; 这里必须要给timer给空值，不能给0
btn.onclick = function(){
clearInterval(timer); 在进行前首先要清定时器
this.disabled =true; 将btn设置不可点击
var that = this; 把btn的代表赋值给that，接下来this会代表的是定时器，而不是btn
timer=setInterval(sec,1000);
function sec() {
count--;
if(count>=0)
{
that.innerHTML = "已发送短信还剩"+count+"秒";
}
else
{
that.disabled = false;
that.innerHTML = "重新发送";
clearInterval(timer); 需要清定时器，否则会一直倒数。
count = 5; 重新赋值5就会到if中，否则永远会执行else。
}
}
}
}
</script>
定时器2 setTimeout()
setTimeout(“函数”, 时间 ) 如果想让这个多次执行，那么需要在递归调用中使用。
setInterval(fn,5000); 每隔 5秒钟，就去执行函数fn一次
setTimeout(fn,5000); 5秒钟之后，去执行 fn 函数， 只执行一次
setInterval是排队执行的
假如 间隔时间是1秒， 而执行的程序的时间是2秒 上次还没执行完的代码会排队, 上一次执行完下一次的就立即执行, 这样实际执行的间隔时间为2秒(意思是跳过间隔，不管间隔时间，直接只算执行的时间。)
setTimeout延迟时间为1秒执行, 要执行的代码需要2秒来执行,那这段代码上一次与下一次的执行时间为3秒. 如果遇到这种情况推荐使用这个。不过这个只执行一次。
5秒之后返回首页案例（重点）
JS 页面跳转: window.location.href = ”http://www.itcast.cn” ; BOM
函数自己调用自己的过程 我们称之为 ： 递归调用
arguments 对象 它只能在正在使用的函数内部使用。
arguments.callee; 返回的是正在执行的函数，它返回的是函数。 也是在函数体内使用。 在使用函数递归调用时推荐使用arguments.callee代替函数名本身。
<script>
var demo = document.getElementById("demo");
var count = 5;
var speed = 1000;
setTimeout(getIndexPage,speed);
function getIndexPage(){
count--;
demo.innerHTML = "<a href =‘javascript:;‘>页面没有找到，本页会在"+count+"秒钟之后跳转</a>";
if(count<=0)
{
window.location.href = "http://www.baidu.com";
}
else
{
setTimeout(getIndexPage,speed);
setTimeout(arguments.callee,speed);还可以这么写，arguments代表正在使用的函数，只能在函数内部使用。
}
}
</script>
5秒后漂浮广告自动消失
！important天王盖地虎，小鸡炖蘑菇
<script>
function $(id){
return document.getElementById(id);
}
function hide(id ){
$(id).style.display= "none";
}
function show(id){
$(id).style.display = "block"
}
a=setTimeout(closeAd,5000);
function closeAd() {
hide("left");
hide("right");
}
// 这个如果想要做再打开是怎么做？
/*clearInterval(a);
setTimeout(showAd,5000);
function showAd(){
show("left");
show("right");
}*/
</script>
小米图片上下滚动案例
要使用定时器，先清除定时器。
clearInterval(timer);
<script>
function $(id){return document.getElementById(id);}
var num = 0;
var timer =null;
$("picUp").onmouseover = function() {
clearInterval(timer);
timer=setInterval(function(){
num=-3;
num>=-1070 ? $("pic").style.top = num +"px" : clearInterval(timer);
},30);
$("picDown").onmouseover = function() {
clearInterval(timer);
timer = setInterval(function(){
num++;
num<0 ? $("pic").style.top = num+"px" : clearInterval(timer);
},30);
}
$("picUp").parentNode.onmouseout = function() {
clearInterval(timer);
}
}
定时器顺序
结果为1,3,2.因为这种定时器是在其他执行完之后执行，就算是时间设定为0，只是表示插入队列，但是不是立即执行。需要等待前面的执行完毕，同时它不能保证执行时间，需要取决于js线程是拥挤还是空闲。
常用运算符
一元操作符 ++， -- + - +5 -6
逻辑操作符 ! && || 与或非
基本运算符 +, -, *, /, %
关系操作符 >, <, >=, <=, ===, ==, !=, !==
= 赋值 == 判断 === 全等
条件操作符 （三元运算符） ? :
赋值运算符 +=, -=, *=, /=, %=
a+=5 a= a + 5
逗号运算符 , var a=0,b=0;
运算优先级
1 ()
2 !、-、++、-- (-10) 负号 正号
3 *、/、%
4 +、- 10-5
5 <、<=、<、>=
6 ==、!=、===、!==、
7 && 与
8 || 或
9?:
10 =、+=、-=、*=、/=、%= 赋值
1+2*3
逻辑运算符（面试题）
运算顺序：！>&&>||
1. a&&b 结果是什么？
如果a 为假 ，则返回 a
如果a 为真 ，则返回 b
&&都真为真，||有真就真，！都假为假
var aa = 0&&1;
alert(aa) // 0
var bb = 1&&0;
alert(bb); //0
var cc = 1&&10;
alert(cc); // 10
a||b
如果 a 为假 则返回b
如果 a 为真 则返回a
console.log(0||1); 1
console.log(1||0); 1
console.log(1||5); 1
console.log(5||1); 5
var a = 1 && 2 && 3;
console.log(a); 3
var b = 0 && 1 && 2;
console.log(b); 0
var c = 1 && 0 && 2;
console.log(c); 0
%=
a+=3
a = a % 3;
注意&&优先级高于||，所以当碰到这两个都有的时候要先算&&，如果两个&&那就先算前面的。
字符串对象常用方法
1. + “” 2+ “” = “2” 2+”ab” = “2ab”
2. String() 转换为字符串
3. toString（基数） ; 基数就是进制
var txt = 10;
txt.toString(2) 二进制 1010
2进制除法
获取字符位置的方法
charAt，获取相应位置字符（参数： 字符位置）
charCodeAt获取相应位置字符unicode编码（参数： 字符位置）
var txt=”abcdefg”;
alert(txt.charAt(3));
结果为c
比如， txt.charAt(4); 索引号一定是从0开始 返回的结果是 d
我们根据我们输入的 位数 返回相应的 字符 。
unicode编码 是我们字符的字符的唯一表示 。
除了汉字外的键盘上所有的键都有unicod编码，可以用来检测按了键盘中的哪个键，每个键都对应唯一的字符。只要在0-127个字符里都是键盘上的，而大于的话肯定是有汉字或者双字节字符。
面试，常用多写，一般考字符串的长度，让写代码
<script>
var txt = "what are you 弄啥咧!好的";
console.log(txt.length);
function getStringLength(str) {
var len = 0; //存储总长度
var c = 0; // 存储每一个编码
for(var i=0;i<str.length;i++)
{
c = str.charCodeAt(i);
//alert(c);
if(c>=0 && c<=127)
{
len++;
}
else
{
len += 2;
}
}
return len;
}
console.log(getStringLength(txt));
</script>
时钟案例
分两步进行的。
第一步： 要得到现在的 时 分 秒
但是这里面有一个小玄机 。
比如现在是 9点整 时针指向 9 是没错的
但是如果现在是 9点半 时针应该指向的是 9到10 之间 才对
所以，我们不但要得到现在的小时 ，还要得到 已经过去了多少分
旋转角度原理
秒针 一秒 走多少度呢 ？
一圈 360 ° 一共有 60 秒 每秒 6 °
分针 一圈 360 一圈走 60次 每次 6° 每分钟 6°
时针 一圈 360 一共 12 个 表盘没有24小时 每个小时 走 30
<script>
window.onload = function() {
var hour = document.getElementById("hour");
var minute = document.getElementById("minute");
var second = document.getElementById("second");
var h= 0,m= 0,s= 0,ms=0;
setInterval(function() {
var date = new Date();
ms = date.getMilliseconds();
s =date.getSeconds()+ms/1000;
m =date.getMinutes()+s/60;
h = date.getHours()%12+m/60;
second.style.webkitTransform = "rotate("+s*6+"deg)";
minute.style.webkitTransform = "rotate("+m*6+"deg)";
hour.style.webkitTransform = "rotate("+h*30+"deg)";
},10);
}
</script>
标签：
原文地址：http://www.cnblogs.com/yiningfamily/p/4976435.html
