bom浏览器对象模型

Posted 2022-12-23 solaris-wwf

 BOM

   　 broswer object model浏览器对象模型

        window 下的属性与方法 

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

             alert(); 

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

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

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

 

            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");
　　　　　　　　
　　　　    

            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"));