js的window常用方法&常用属性

知识总结:
<pre>
浏览器对象模型BOM:将浏览器常用方法封装进window对象,对外供js调用
具体实现:window对象
</br>
1.window对象的常用方法:
--框体方法:
alert():警告框
confirm():确认框。点击确定返回true,点击取消返回false
prompt("提示语","默认值"):提示框。点击确定返回当前值,点击取消返回null
</br>
--定时执行和间隔执行:
setTimeOut(要执行的函数,时间):指定时间后开辟线程执行指定函数,返回线程id
setInterval(要执行的函数,时间):每隔指定时间开辟一个线程执行指定的函数,返回线程id
clearInterval(id):关闭指定的interval开启的线程
clearTimeout(id):关闭指定的timeout开启的线程
</br>
--子页面方法:
open():使用此方法可以打开当前页面的子页面,使用以下属性设置子页面窗口的大小,位置,及显示选项height=400,width=600,top=200,left=400,tooibar=yes,menubar=yes,scrollbars=no,resizable=yes,location=yes,status=yes
close():在子页面中使用此方法,关闭使用open打开的子页面。
</br>
注意:open(父页面中声明)和close(子页面中声明)需要配套使用,否则close不奏效,即子页面调用close方法的前置条件是:子页面是由父页面使用open方法打开的
</br>
--重要的属性:
opener:window.opener.父页面函数名
使用opener调用父页面的函数。
</br>
2.window属性学习
--screen:获取客户端信息
width:获取屏幕的宽度分辨率
height:获取屏幕的高度分辨率
availWidth:可用宽度
availHeight:可用高度
</br>
--location:地址栏属性
href:可以获取和修改当前地址栏URL信息
reload():刷新当前页面
</br>
--history:历史记录属性
forward():相当于浏览器的前进按钮
backward():相当于浏览器的后退按钮
go():前进或后退到指定历史记录,正整数表示前进,负整数表示后退,0表示自己
</br>
--navigator:浏览器版本信息属性
userAgent:获取当前浏览器的版本信息
</pre>
代码示例:

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript">
            function myScreen(){
                var screen=document.getElementById("screen");
                screen.innerHTML="分辨率:"+window.screen.height+"*"+window.screen.width+"<br>"+
                "可用分辨率:"+window.screen.availHeight+"*"+window.screen.availWidth;
            }
            function myNavigator(){
                var nav=document.getElementById("navigator");
                nav.innerHTML="浏览器版本信息:"+window.navigator.userAgent;
            }
            /*警告框*/
            function myAlert(){
                window.alert("Alert Frame");
            }
            /*确认框*/
            function myConfirm(){
                var flag=window.confirm("Confirm Frame");
                window.alert("show flag:"+flag);
            }
            /*提示框*/
            function myPrompt(){
                var flag=window.prompt("Prompt Frame","default value");
                window.alert("show flag:"+flag);
            }
            /*使用setTimeOut动态获取当前系统时间*/
            function mySetTimeOut(){
                var date=new Date();
                var h=date.getHours();
                var m=date.getMinutes();
                var s=date.getSeconds();
                var current=h+":"+m+":"+s;
                var span=document.getElementById("myspan");
                span.innerHTML=current;
                window.setTimeout(mySetTimeOut,1000);
            }
            var id;
            /*使用setInterval制造流氓提示框*/
            function mySetInterval(){
                id=window.setInterval(function(){
                    alert("就是想看你灭不掉我的样子");
                },4000);
            }
            /*使用clearInterval关闭setInterval开启的线程。clearTimeOut同。*/
            function myClearInterval(){
                alert(id);
                window.clearInterval(id);
            }
            function myOpen(){
                window.open("ad.html","son","height=200px,width=400px,top=200px,left=300px");
            }
            function myOpener(){
                window.location.reload();
                window.alert("页面已刷新");
            }
            
        </script>
    </head>
    <body onload="mySetTimeOut();mySetInterval();myOpen();myScreen();myNavigator();">
        <p>
            <span id="screen">
                
            </span>
        </p>
        <p>
            <span id="navigator">
                
            </span>
        </p>
        <p>
            <input type="button" name="" id="" value="测试警告框" onclick="myAlert();" />
            <input type="button" name="" id="" value="测试确认框" onclick="myConfirm();" />
            <input type="button" name="" id="" value="测试提示框" onclick="myPrompt();" />
        </p>
        <p>
            <input type="button" name="" id="" value="一键消灭流氓警告框" onclick="myClearInterval();" /><br />

        </p>
        <p>
        <span id="myspan"></span>
        </p>
        
    </body>
</html>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,265评论 6 490
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,078评论 2 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 156,852评论 0 347
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,408评论 1 283
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,445评论 5 384
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,772评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,921评论 3 406
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,688评论 0 266
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,130评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,467评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,617评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,276评论 4 329
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,882评论 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,740评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,967评论 1 265
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,315评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,486评论 2 348

推荐阅读更多精彩内容