JS-BOM

标签：包括   控制   用户   翻页   cti   高度   row   client   延迟   

# BOM
## Browser Object Model 
- 浏览器对象模型
- BOM对象都是作为window对象的属性保存的
- window 代表浏览器窗口
- navigator 代表浏览器的信息.可用来识别浏览器
- history 浏览器的历史记录
- location 代表浏览器的地址栏信息
- screen 用户的显示器信息

#### window 
- window.innerHeight
     - 浏览器窗口的内部高度(包括滚动条)
- window.innerWidth 
     - 浏览器窗口的内部宽度(包括滚动条)
- window.outerWidth
    - 整个浏览器的宽度
- window.outerHeight
    - 整个浏览器的高度
- window.pageXoffset
    - 返回当前页面相对于窗口显示区左上角X的位置
- window.pageYoffset
    - 返回当前页面相对于窗口显示区左上角Y的位置
- window.screenLeft
    - 返回相对于屏幕窗口的x坐标
- window.screenTop
    - 返回相对于屏幕窗口的y坐标
- document.documentElement.clientHeight
    -  获取可见内容的高度(不包括滚动条边框) 
- document.documentElement.clientWidth
    -  获取元素内容区宽度(不包括滚动条边框)
- window.open() 
    - 打开新窗口
- window.close() 
    - 关闭当前窗口
- window.moveTo() 
    - 移动当前窗口
- window.resizeTo() 
    - 调整当前窗口的尺寸
    

#### navigator
- 判断浏览器的信息
- 由于历史原因navigator大部分属性都不能用来识别浏览器了
- 仅剩的属性userAgent可判断浏览器版本

        //通过userAgent来判断浏览器的信息
        if(/firefox/i.test(ua)){
            alert("火狐浏览器");
        }else if(/edge/i.test(ua)){
            alert("Edge浏览器")
        }else if(/chrome/i.test(ua)){
            alert("chrome浏览器");
        }else if(/msie/i.test(ua)){
            alert("ie11以下浏览器");
        }else if("ActiveXObject" in window){
            alert("ie11浏览器");
        }

#### history 
- 该对象代表用户的历史记录
- 由于隐私原因该对象只能控制浏览器向前或向后翻页
- 只可访问当次的历史记录

        //history.length 可以获取当次访问历史记录的数量
        
        //history.back(); 可以回退到上一个页面.功能相当于浏览器的后退按钮
          
        //history.forward();可以跳转到下一个页面.功能相当于浏览器的前进按钮
          
        //history.go();可以跳转到指定的页面.
        //需要一个整数作为参数.将会跳转指定数量的页面
          

#### location
- 表示浏览器地址栏的信息
- 直接输出location会返回当前页面的地址
- 直接修改location的值会使浏览器跳转到修改的地址

        location.assign(); 可以用来跳转到指定的页面.
          - 需要一个路径作为参数.将会跳转到该路径
          - 会生成历史记录
                  
        location.replace(); 也可以跳转到指定页面
          - 同样需要一个地址作为参数
          - 用法和assign()一样
          - 不会生成历史记录.不可以回退
                
        location.reload(true); 刷新当前页面
          - 在该方法中可以传递一个true.则会强制清空缓存
                

#### 定时调用定时器
- 每间隔一段时间就调用指定的函数一次
- 可执行多次
- **setInterval()开启一个定时**
- 参数:
    - 回调函数.
    - 函数调用相隔时间的毫秒数
- 返回值:
    - 会返回一个number类型的值
    - 该number就是定时器的标识.需要有一个变量来接收
- **clearInterval() 关闭定时器**
- 参数: 定时器的标识

#### 延时调用定时器
- 函数不马上执行,而是过一段时间以后再执行
- 只执行一次
- **setTimeout()来设置延时调用**
- 参数:
    - 回调函数
    - 延迟执行的毫秒数
- **clearTimeout() 关闭延时调用定时器**

#### 弹窗
- alert() 警告框
- confirm() 确认框 (含有确认和取消按钮)
- prompt() 提示输入框

JS-BOM

标签：包括   控制   用户   翻页   cti   高度   row   client   延迟   

原文地址：http://www.cnblogs.com/huifang/p/7341919.html