BOM浏览器对象模型

 BOM

   　 broswer object model浏览器对象模型

        window 下的属性与方法 

            浏览器可以使用三个函数的系统对话框，向用户输出信息

             alert(); 

             confirm(); 带有确定与取消，返回值true,false

             prompt(); 带有输入框。返回值，输入的内容，空则为null，

             prompt("请输入",9); 输入框默认值9，

　　　　onload = function () {};页面全部加载完成后执行

　　　　onscroll = function () {};当页面有滚动条，滚动条滚动的时候触发。

　　　　　　 var a = document.documentElement.scrollTop || document.body.scrollTop; 兼容性获取滚动条的当前距离顶部的距离

　　　　onresize = function() {};当页面不是全屏的时候，拉伸页面显示区域的时候触发

　　　　　　 var w = document.body.clientWidth || document.documentElement.clientWidth || window.innerWidth; 兼容性获取页面的宽度

　　　　　　 var h = document.body.clientHeight || document.documentElement.clientHeight || window.innerHeight; 兼容性获取页面的高度

 

            open();

　　　　open("www.baidu.com");
　　　　open("www.baidu.com","baidu");
　　　　open("www.baidu.com","baidu","width=400,height=300,top=200,left=200");//url,名称，打开窗口大小
　　　　open("sub.html","子页面"); //在子页面可以获取一个 alert(opener); 

                 

                opener:当前窗口的父窗口的window对象。===》IE不支持该方法

        window.onload = function(){
                var btn = document.getElementById("btn");
                btn.onclick = function(){
                open("004sub.html","baidu","width=400,height=300,top=200,left=200");
　　　　　　　　}
　　　　}    

　　　　close();关闭当前页面，谷歌浏览器支持这个方法，火狐浏览器需要配置。

            location：

                window对象下面也有lacation,document下面也有，他们是同一个

                提供了当前窗口加载文档的有关信息(地址栏的输入框)，还提供了导航功能，

                window.location或者location(可以忽略window),window.document.location，

                url：的概念统一资源定位符

　　　　  protocol:host主机名/域名:port端口号/pathname search hash(#1)

                属性

                    hash:锚点，网址后面跟的#1,实现页面内的定位导航作用， location.hash = "#3"; 

                    host:主机名+：端口号，浏览器默认的端口号是80，

                    hostname:返回主机名 域名/ip

                    href:整个网址

                    pathname：路径名，域名后面的路径

                    port:端口号

                    protocol：协议部分,本地协议file:，网络协议http:

                    search:查询字符串，网络地址url？后面的部分， location.search = "?name=xxx&psd=xxx"; 

                方法()；

                    assign():跳转到指定页面，方法与href相同， location.assign("ww.baidu.com"); 

                    reload();重载当前url,可以加入参数true，则不带缓存,强制从服务器源头重载，清除数据缓存

                    replace();用新的url替换当前页面，与assign不同的地方：不能用浏览器的返回键返回原来的页面

            history:属性

                保存用户的历史几率，浏览器上面的前进返回键区域

                属性

                    length:返回history中历史记录的总数

                方法

                    back();返回上一条历史记录

                    forword();前进下一条历史记录

                    go();负数的时候返回到相应的历史记录，当是0的时候重载页面，正数的时候前进历史记录

                    search();

 

练习search方法从网址中取出name和psd

        var search = "?id=star&psd=223";
        function showValue(search,id){
            var start = search.indexOf(id);//获取id当前下标
            if(start == -1){
                return;//如果没有相应字符串，返回
            }else{
                var end = search.indexOf("&",start);//搜索&的下标
                if(end == -1){//如果查找后面的键值对，则没有&
                    end = search.length;
                    //return search.substring(start,end);
                    return search.substring(start,end).split("=")[1];//也可以生成一个数组只返回后面的数值
                }else{
                    return search.substring(start,end).split("=")[1];
                }
            }
        }
         alert(showValue(search,"id"));

 间歇性定时器

　　　　setInterval

       var timer = setInterval (function(){


       },2000);//设定一个ID为timer的定时器，每隔2秒触发一次函数
       function func1(){
           clearInterval(timer);//清除定时器
       }

延迟定时器

 　　　　setTimeout

　　　　var time = setTimeout(function() {
    
　　　　}, 2000);//2秒后只触发一次函数