js基础-BOM基础

一.  BOM基础:

a)    BOM:

   i.  browser object model浏览器对象模型

   ii.  提供让JavaScript能操作浏览器窗口的相关api(方法或函数)

    iii.   没有标准,不同的浏览器会有不同兼容性问题

b)    window对象:

     i.  浏览器窗口对象

    ii.   浏览器环境下JavaScript中的顶级对象,

   iii.   所有全局对象、变量、方法以及第三方拓展对象都属于window对象的属性和方法。

        1.    DOM

        2.    HTML5相关: 本地存储 音频,视频Canvas,svg

c)    Window常用事件:

     i.  window.onload:等待所有资源都加载完再加载JavaScript代码,页面加载完事件。

     ii.  window. onresize:浏览器窗口大小变化时事件

 // 一、Window常用事件
        
        //用于等html节点加载完毕后再进行js对节点的渲染
        window.οnlοad=function(){
            // alert("哈哈哈");
        }
        //浏览器窗口大小变化时事件,会监听浏览器窗口的变化
        window.οnresize=function(){
            console.log('11');
        }

d)    window下常用的对象及其属性:

       i.    navigator:导航器对象

            1. 含有浏览器相关的信息。

            2. 练习:判断浏览器类型:window.navigator.userAgent

  // 二、window下常用的对象及其属性:

        //1、navigator:导航器对象,含有浏览器相关的信息
        //appVersion返回浏览器的平台和版本信息
        console.log(window.navigator.appVersion);

        //userAgent返回有客户机发送服务器的user-agent头部的值,可用于判断浏览器类型
        // console.log(window.navigator.userAgent);
        //实例:判断浏览器的类型
        function diffBrowser() {
            var str = window.navigator.userAgent.toLowerCase();
            var reg=/(msie|chrome|firefox|opera|safari)/g;
            return str.match(reg)[0];
        }

     ii.    Location:位置对象

            1.  用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面。

            2. window.location.href获取页面ur,跳转

            3.  location.relaod重新加载页面

    
    
    
                    
                    

你可能感兴趣的:(js)