js中的知识

Bom 浏览器对象模型

一、弹框

alert 警告框

prompt 带输入框的提示框 点击确认 该方法的返回值是输入的值或默认值

confirm 提示信息框 返回时 true false

代码：

结果：

                  

           

获取非行内样式的方法

获取用户网页选择的内容

二、windows的相关尺寸问题

               

navigator 对象是获取当前设备的相关信息 对象包含有关浏览器的信息

代码;

结果：

appCodeName:返回浏览器的代码名

appName：返回浏览器的名称

appVersion：返回浏览器的平台和版本信息

cookieEnabled：返回指明浏览器中是否启用cookie的布尔值

三、window对象里面的计时器

一次性计时器：setTimeout 延迟多长时间去执行 返回值是数字

循环计时器

帧计时器（按照电脑屏幕的刷新频率执行）

代码：

 

结果：

代码：

     

代码：

    

上述结果都是1

计时器里的this指针指向的是window

（1）给计时器传值；计时器调用方法需要传递实参，在计时器后边直接写值

代码：

结果为10

把一次性计时器做成循环计时器

使用的是函数的递归来实现

clearTimeout 关闭计时器的方法

代码：

结果：

                    

循环计时器setInterval和setTimeout使用方式一致

代码：

结果：

帧率计时器（requestAnimationFrame） 类似setTimeout

使用递归来做循环计时器

cancelAnimationFrame 关闭计时器

代码：

结果：

帧率计时器的兼容性写法：

var requestAnimation = requestAnimationFrame || webkitRequestAnimationFrame || mozRequestAnimationFrame || msRequestAnimationFrame
         || function (callback) {
             setTimeout(callback, 1000 / 60);
         }
 var cancelAnimation = cancelAnimationFrame || webkitCancelAnimationFrame || mozCancelAnimationFrame || msCancelRequestAnimationFrame
         || function (number) {
             clearTimeout(number);
         }
 var count = 0;
 var time;
 loop();
 function loop() {
     count++;
     console.log(count);
     if (count > 30) {
         cancelAnimation(time);
         return;
     }
     time = requestAnimation(loop);
 }

结果：

          

requestAnimationFrame 在浏览器失去焦点的时候会自动暂停

setInterval setTimeout不会自动暂停

四、window转码解码方法

btoa 转码

atob解码

注意：不能直接对汉字进行转码解码

代码：

结果：

对汉字：

代码

结果：

汉字转base64位转码解码

代码：

五、window事件