Javascript高级程序设计_7_BOM之Window

• 首先明白BOM的全称为Browser Object Model，其中window表示为浏览器的一个实例。

1. 直接声明的变量不能delete，而window的变量可以用delete

        var age=10;
        window.color="red";
        delete window.age;
        delete window.color;
        console.log(window.age);//10
        console.log(window.color);//undefined

　　　　直接声明的age无法被delete删除。

　　2. 页面的窗口关系和框架

</head>
<frameset rows="160,*">
    <frame src="frame.htm" name="topFrame">
    <frameset cols="50%,50%">
        <frame src="anotherFrame.htm" name='leftFrame'></frame>
        <frame src="yetanotherFrame.htm" name='rightFrame'></frame>
    </frameset>
</frameset>>

 以上代码示例来自于书上。主要分析一下这个框架的定义特点

• • 首先框架定义在了head之后。而body可以定义在框架之内。
  • 在一个frameset框架内定义一个frame。这个框架定义了rows，即高度引用frame.htm文件，命名为topFrame,该frame有个默认的高度，宽度默认为满宽度
  • 然后在这个框架内，嵌套一个frameset框架，里面包含左右两个frame。
  • 若要引用第一个框架，那么借助top.frames[0]即可。

    top 对象始终指向最高（最外）层的框架，也就是浏览器窗口。使用它可以确保在一个
    框架中正确地访问另一个框架

  • parent与top相对，始终指向当前框架的直接上层框架。嵌套框架集的父类框架集。这个很好理解
  • 所有这些都是window对象的属性，可以通过window.parent或者window.top来访问。

　　3. 窗口大小

• • innerWidth, innerHeight, outerWidth, outerHeight这四个属性分别显示页面视图容器的宽和高，浏览器窗口的宽和高。调用方法为window.XXXX
  • window.open()可以打开特定的url，第一个参数为传入的url，第二个参数为在已有的窗口或框架内打开url，这个参数为窗口或框架的名字

　　　　　　window.open("http://www.wrox.com/", "topFrame");

• • window.open()方法，如果第二个参数是不存在的窗口或框架名，那么需要传入第三个参数，第三个参数为打开的位置。意思就是：在第三个窗口的位置，打开一个新的标签页。

        window.open("http://www.wrox.com/","wroxWindow",
"height=400,width=400,top=10,left=10,resizable=yes");

• • 自己尝试了一下，记住要把浏览器的页面拦截关掉，不然打不开。
  • wroxWindow为新窗口的标签名。如果要在不经过用户同意下关闭，首先需要将window.open（..）赋给一个变量win，通过win.close()的方法，关闭窗口。
  • win.opener=null，这样设置可以保证新打开的标签页不需要与打开它的标签页进行通信。
  • 如果浏览器阻止了新的弹窗，那么win.opener会被自动置为null。

　　4. 间歇调用问题

• • setTimeout()函数是window对象的方法。
  • 第一个传参为函数，就是要干什么事情，第二个参数式时间，指延迟多久后执行
  • 该函数有返回值，返回的是一个数值ID，可以通过clearTimeout来消除这个延迟的效果

        var timeoutId=setTimeout(function(){//
            alert("setTimeout"),1000
        })
        clearTimeout(timeoutId);

• • 同样的，setInterval()函数也是window对象的方法，使用方式和setTimeout一样，效果是每隔多少时间进行什么事情。同样可以通过clearInterval来消除这个效果。

　　　4. 系统对话框

• • 包括alert, confirm和prompt这三个函数。
  • confirm() 函数很像一个警告，表示是否确定还是取消。
  • prompt()函数返回文本输入域的值，例如：

        //prompt
        var res=prompt("what is your name?","Mike");
        if(res!==null){
            console.log("Hello "+res);
        }

　　　　　第二个参数可以不写，只要用户在文本框内输入，那么res就会记录下来并返回。

　　　另外补充window.print()和window.find()这两个功能分别是打印和查找，我们在js中可以通过调用他们来打开方法。