JS 章节② 基础应用(下) : 定时器

1. Date

获取 年 月 日 星期 时 分 秒

2.定时器

setInterval 间隔型 : 间隔多少ms执行一次
setTimeout 延时型 : 延时 多少ms执行

两种定时器的区别:

setInterval 间隔型 ,可执行多次
setTimeout 延时型 , 只执行一次

• 开启定时器 setInterval()

var btn1 = document.getElementById('btn1');
var btn2 = document.getElementById('btn2');
var i = 0;
var timer = null;
btn1.onclick = function () {
       //开启定时器
       timer = setInterval(function () {
           i++;
           alert(i);
      },1000);
}

• 关闭定时器 clearInterval(timer);

btn2.onclick = function () {
       i = 0;
       clearInterval(timer);
}

3.截取字符串

• str[0];不兼容低版本浏览器,如IE7等;

var a = 'abcdef';
alert(a[0]);

• str.charAt(0); 兼容各种浏览器

var a = 'abcdef';
a.charAt(0); //兼容各种浏览器

4.数字时钟练习

    
    
    
    


![](image/0.png)
![](image/0.png)
:
![](image/0.png)
![](image/0.png)
:
![](image/0.png)
![](image/0.png)

数字时钟

5.延时提示框

简化代码:合并两个相同的mouseover和mouseout

延时提示框

6.无缝滚动

向左走
向右走

    

        
![](img2/1.jpg)
        
![](img2/2.jpg)
        
![](img2/3.jpg)
        
![](img2/4.jpg)
    

无缝滚动