定时器的运用

109 阅读1分钟

BOM:Browser Object Model(浏览器对象模型)提供了独立于内容与浏览器窗口进行交互的对象

     window.prompt('输入一个数') 
    console.log(window);
    window.alert(1) 
      确认框	window.confirm()	
      用于验证是否接受用户操作 

 题目:
     let flag = confirm('你是最强王者吗');
     alert(flag) 
     你是一个好学生吗?
    如果是 就alert出 继续加油
    如果不是 就alert出 我还要努力   
    

答案

       if( confirm('你是一个好学生吗?') ){
           alert('继续加油')
       }else{
         alert('我还要努力')
       }
       

prompt的第二个参数是默认值

     let v = prompt('今天你快乐吗','快乐')
     alert(v)
     

这个是地址的参数信息

     console.log(window.location.search);
     这是地址路径 
     console.log(window.location.href)
      这个是地址的端口 
     console.log(window.location.port)

后退

    function back() {
         window.history.back(); 
         两者的作用一致 都是后退 
        window.history.go(-1);
    }
    

前进

    function forward(){
         window.history.forward(); 
        window.history.go(1)
    }
    

刷新

    function go(
         go里面是没有任何参数的 
         window.history.go(); 
         两者功能相等 都是刷新 
         window.history.go(0); 
         这个也表示刷新 
        location.reload();
    }
       
    

定时器

定时器会返回一个唯一的id

     let id = setInterval(function(){
         console.log('我爱js<br>');
         console.log(id);
     },1000)

根据定时器返回的唯一的id 来清除定时器

     function clearfn(){
         clearInterval(i
     }

练习:过一秒钟 在控制台上打印出 一个数字 比如1,再过一秒钟 打印出2 ....点击清除定时器 终止打印

     let i = 0;
     let id = setInterval(function () {
         i++;
         console.log(i);
     }, 1000)

     function clearfn() {
         clearInterval(id)
     }

      setTimeoutsetInterval的区别是
    setTimeout只执行一次 
     也会产生一个唯一的id标识 
     let id = setTimeout(function (){
        console.log('我说冷笑话');
    },1000) 
    

过3秒钟 把这个广告显示出来

     document.getElementById('guangao').style.display = 'none' 
     setTimeout(function(){
         document.getElementById('guangao').style.display = 'block' 
     },3000)
     
     

过3秒钟 把这个广告关闭

      document.getElementById('guangao').style.display = 'block' 
     setTimeout(function(){
         document.getElementById('guangao').style.display = 'none' 
     },3000)