介绍

BOM 即 browser object model 浏览器对象模型

BOM的范围大于DOM ，关键字用window（浏览器顶级对象）

window下的特殊属性 name ，打印显示空

常用api

setTimeout( 回调函数 , 毫秒数（不写默认为0） ) 设置定时器但是时间到了只执行一次 setTimeout( function(){xxx},0)

clearTimeout( 定时器标识符 )
停止某个定时器继续倒计时 clearTimeout(timer)

setInterval( 回调函数 , 毫秒数（不写默认为0） ) 设置定时器但是可以无限调用(时间到了重新倒计时) setInterval( function(){xxx},0)

clearInterval( 定时器标识符 ) clearInterval(timer)

倒计时案例

当前时间：
<div class="nowtime"></div>
距离国庆节：
<div class="timer"></div>

<script>
    var timer = document.querySelector('.timer')
    var nowtime = document.querySelector('.nowtime')

    function getTime() {     // 获取当前年月日时分秒
        var date = new Date()
        var year = date.getFullYear();
        var month = date.getMonth() + 1;    //date.getMonth()获取的是0-11 0代表一月
        var day = date.getDate();
        var hours = date.getHours();
        var minutes = date.getMinutes()
        var seconds = date.getSeconds()
        month = month < 10 ? "0" + month : month
        day = day < 10 ? "0" + day : day
        hours = hours < 10 ? "0" + hours : hours
        minutes = minutes < 10 ? "0" + minutes : minutes
        seconds = seconds < 10 ? "0" + seconds : seconds
        let time = year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
        return time;
    }
    function countDown(time) {
        var nowTime = +new Date();// 返回的是当前时间总的毫秒数
        var inputTime = +new Date(time);// 返回的是用户输入时间总的毫秒数
        var times = (inputTime - nowTime) / 1000;// times是剩余时间总的秒数 
        var d = parseInt(times / 60 / 60 / 24);// 天 (除60得分 除60得时  除24得天数)
        d = d <10 ? '0' + d : d;    
        var h = parseInt(times / 60 / 60 % 24);//时 (除60得分 除60得时  除24取余得不满一天剩下的小时数)
        h = h < 10 ? '0' + h : h;
        var m = parseInt(times / 60 % 60);// 分 (除60得分 除60取余得不满一小时剩下的分钟数)
        m = m < 10 ? '0' + m : m;
        var s = parseInt(times % 60); // 当前的秒 (除60取余得不满一分钟剩下的秒数)
        s = s < 10 ? '0' + s : s;
        countdown =   d + '天 ' + h + '时 ' + m + '分 ' + s + '秒'
        timer.innerHTML = countdown
    }
    nowtime.innerHTML = getTime();
    setInterval(function () {
        nowtime.innerHTML = getTime();
    },1000)

    var ttt = '2022-10-1 00:00:00'
    countDown(ttt)
    setInterval('countDown(ttt)',1000)
    </script>

效果：

this指向问题

• 全局作用域或普通函数中this指向全局对象window （如 定时器中、函数中、全局中的log里this均是指向window）

• 对象中的方法中的this指向的是对象

• 按钮元素的点击事件的this指向的是按钮元素 （如 按钮元素.onclick = 函数 中 和 addEventListener('click',函数）中的this都是这项按钮元素)

• 实例化的构造函数 中的this指向实例对象 （如 function Fun(){} ; var fun = new Fun(); 中Fun中的this指向fun）