定时器

在js中定时器有两种
1，setInterval()
2，setTimeout()

1. setInterval()
   格式：var 变量名 = setInterval(“执行的语句”,每隔多久执行一次);
   【注意】可以写执行的代码，也可以直接传入函数。
   返回值：启动定时器时，系统分配的编号

关闭定时器的方式：
1.关闭页面。
2.clearInterval();
【注意】 clearInterval函数需要一个参数：定时器的编号。

2. setTimeout（）
   只在指定时间后执行一次
   关闭：clearTimeout();
   【注意】 clearTimeout函数需要一个参数：定时器的编号。

用定时器和Date时间来制作一个钟表

代码如下

<script>
       //这里先定义一个自定义的时间格式
       function showTime(d) {
            // 获取年
            var year = d.getFullYear();
            // 获取月
            var month = d.getMonth() + 1;
            // 获取日
            var date = d.getDate();
            // 小时数
            var hours = d.getHours();
            // 获取分钟数
            var m = d.getMinutes();
            // 获取秒数
            var seconds = d.getSeconds();
            // 获取星期几
            var day = d.getDay();
            var str = year + "年" + doubleNum(month) + "月" + doubleNum(date) + "日  星期" + num2Chinese(day) + " " + hours + ":" + m + ":" + seconds;
            return str;
        }
        // 数字转中文
        function num2Chinese(num) {
            var arr = ["日", "一", "二", "三", "四", "五", "六"];
            return arr[num];
        }
        // 给小于10的前面补0
        function doubleNum(n) {
            if (n < 10) {
                return "0" + n;
            } else {
                return n
            }
        }
        window.onload = function() {
            // 没有名字的函数，我们叫做匿名函数
            setInterval(showDate, 1000);
            var box = document.getElementById("box");

            function showDate() {
                // 这里调用时间函数
                box.innerHTML = showTime(new Date());
            }
        }
  </script>      

秒表，计时表

用于计时的秒表。

为初始样式
点击开始进行计时。
时间为 ，，分钟：秒：毫秒
代码如下：
这里只写js代码css样式可随意更改。

    <script>
        window.onload = function(){
            // 分钟数
            var min  = 0;
            // 秒数
            var sec = 0;
            // 毫秒数*10
            var ms = 0;
            // 定时器ID
            var timer = null;
            // 获取页面上所有span标签，返回类数组（伪数组）
            var spans = document.getElementsByTagName("span");
            // 复位按钮 点击事件
            $("resetBtn").onclick = function(){
                // 把分钟，秒，毫秒都清零
                min = 0;
                sec = 0;
                ms = 0;
            
                spans[0].innerHTML = "00";
                spans[2].innerHTML = "00";
                spans[4].innerHTML = "00";
            }
            // 第二个按钮
            $("startBtn").onclick = function(){
                //点击了开始按钮
                // 1.启动定时器，
                // 2.将按钮的文本修改为停止
               if ($("startBtn").innerHTML == "开始") {
                    $("startBtn").innerHTML = "停止";
                    // 防止出现bug，最好在启动定时器之间，先清除定时器。
                    clearInterval(timer);
                    //每十毫秒执行一次，因为显示毫秒数是00两位，真实毫秒数是1000毫秒等于1秒。
                    timer = setInterval(show,10);
               }else{
                //    点击停止按钮
                // 1.停止计时器
                // 2.将按钮的文本修改为开始、
                    $("startBtn").innerHTML = "开始";
                    clearInterval(timer);
               }
               
            }
            function $(str){
            return document.getElementById(str);
        }
        // 生成时间,（每10毫秒执行一次。）
        function show(){
            // ms加一
            ms++;
            // 如果等于100，则秒数进1
            if(ms == 100){
                sec++;
                ms=0;
            }
            // 秒数等于60，则分钟数进1，秒数等于0
            if(sec == 60){
                min++;
                sec = 0;
            }
            // 为了给小于10的补0
            var msStr = ms;
            if(ms<10){
                msStr = "0"+ms;
            }
            var secStr = sec ;
            if(sec<10){
                secStr = "0"+sec;
            }
            var minStr = min;
            if (min<10) {
                minStr = "0"+min;
            }
            spans[0].innerHTML = minStr;
            spans[2].innerHTML = secStr;
            spans[4].innerHTML = msStr;
        }
        }
    </script>

BOM对象

常见的BOM对象：
1.window 代表整个浏览器窗口，window对象是BOM中的*对象。
2.Navigator 表示浏览器的一些信息。
3.Location 表示浏览器当前的地址信息。
4.History 浏览器的历史记录信息。
5.Screen 表示用户的屏幕信息。

window对象的常用方法：

1. 弹出系统对话框。
   (1) alert()
   (2) prompt()
   (3) confirm()确认窗口
2. 打开窗口
   window.open(url,target,param)
   url :要打开的地址
   target:新窗口的位置。 _blank,_self,_parent(父框架下)
   param:新窗口的一些设置。
   name：新窗口的名字，可以为空
   【注意】name需要写在target前面。
   返回值：新窗口的句柄。
3. 关闭窗口
   window.close(); 关闭当前窗口
   open返回值.close(); 关闭新窗口

示例：