JS基础速成(二)-BOM(浏览器对象模型)

 1.screen对象。

       console.log(screen);
            console.log(window.screen);
            console.log(screen.width);
            console.log(screen.height);
            console.log(screen.availHeight);//可用高度=screen-height-底部任务栏高度
            console.log(screen.availWidth);//可用宽度

2.location对象。

       console.log(location);
            console.log(location.href);//完整的URL路径
            console.log(location.protocol);//协议名
            console.log(location.hostname);//主机名
            console.log(location.port);//端口号
            console.log(location.host);//主机名+端口号
            console.log(location.pathname);//文件路径
            console.log(location.search);//从?开始的参数部分
            console.log(location.hash);//从#开始的锚点部分

3.使用location进行页面跳转。

       function gotoBaidu(){//1
                location="http://www.baidu.com";
//                window.location.href="http://www.baidu.com";
            }

4.跳转页面,加载新页面以后,可以点击回退按钮返回。

       function gotoBaiduByAssign(){//2
                location.assign("http://www.baidu.com");
            }

5.跳转页面,加载新页面以后,没有回退按钮,无法返回。

       function gotoBaiduByReplace(){//3
                location.replace("http://www.baidu.com");
            }

6.刷新当前页面。

①location.reload();刷新页面,如果本地有缓存,将从缓存中读取,相当于F5。
②location.reload(true);强制刷新,无论是否有缓存,都将请求后台加载最新数据,相当于Ctrl+F5。

       function reloadPage(){//4
                location.reload();//刷新
                location.reload(true);//重新加载页面,强制刷新
            }

7.history。

       console.log(history);
            console.log(history.length);//用于记录当前页面跳转的历史页面个数

8.点击去前一页,相当于浏览器的前进按钮,点击去后一页,相当于浏览器的后退按钮。

       function forward(){
                location.forward();
            }
            function back(){
                location.back(;)
            }

9.表示跳转到浏览历史的任意页面。

  +1前面一页,相当于location.forward();
  -1后面一页,相当于location.back();
  0当前页,刷新页面history.go(2);//第二页0刷新当前页

       function go(){
                history.go(2);//第二页0刷新当前页
            }

10. navigator了解,返回关于浏览器的的各种信息。

       console.log(navigator);
            //检测浏览器安装的所有插件
            for(var i=0;i<navigator.plugins.length;i++){
                console.log(navigator.plugins[i].name);
            }

1.prompt():弹窗输入
 alert():弹窗输出
2.confirm("");带确定、取消的提示框,分别返回true、false
3.close();关闭当前浏览器窗口。
4.open();打开一个新窗口
 参数一:新窗口的地址
 参数二:新窗口的名字
 参数三:新窗口的各种配置属性
 width=600px,height=200px,top=10px;left=20px
5.setTimeout();延时器,表示延时多少ms执行一个函数。
 参数一:可以传入匿名函数,也可以传入函数名。
 参数二:延时毫秒数
 参数三~参数n:传给回调函数的参数。
 setTimeout(function(num1,num2){},2000,"haha",123);
6.setInterval();定时器,表示每隔多少毫秒执行一遍,其他方法与setTimeout()完全相同。
7.clearInterval和clearTimeout():分别清楚定时器,延时器。
 声明定时时,可以接受返回的ID,并将ID传给clearInterval即可清除。

//定时器
            var num=0;
            var intervalID=setInterval(function(){
                num++;
                console.log(num);
            },1000);
            setTimeout(function(){
                clearInterval(intervalID);
            },5000);
            var num=0,sum=0;
            var intervalID=setInterval(function(){
                num++;
                console.log(num);
                if(num>9){
                    clearInterval(intervalID);
                }
            });

猜你喜欢

转载自www.cnblogs.com/gcywj/p/8976527.html