BOM

一.window对象

1.全局作用域

(1)BOM以window对象为依托,表示浏览器窗口以及页面可见区域。同时还是ECMAScript中的Global对象。所有全局作用域中声明的变量和函数都会变成window对象的属性和方法,所有原生的构造函数及其他函数都存在于它的命名空间下

(2)全局变量和window对象上定义的属性区别:

全局变量不能通过delete操作符删除,而直接在window对象上定义的属性可以

2.窗口关系及框架

(1)在使用框架时,每个框架都有自己的window对象以及所有原生构造函数及其他函数的副本,每个框架都存在于frame集合中,可以通过位置或者名称来访问。

(2)有一些窗口指针,可以用来引用其他框架,包括父框架。

(3)top对象始终指向最外围的框架,也就是整个浏览器窗口。最好使用top而不是window,因为window指向每个框架的实例:top.frames[0]

(4)parent对象表示包含当前框架的框架,而self对象始终指向window

3.窗口位置

(1)跨浏览器取得窗口左边和上边的位置

var left=(typeof window.screenLeft==”number”)?window.screenLeft:window.screenX;

var top=(typeof window.screenTop==”number”)?window.screenTop:window.screenY;

(2)将窗口精确移到一个新位置

moveTo() 接受坐标 window.moveTo(200,300);

moveBy() 接受像素 window.moveBy(0,100);

4.窗口大小

无法确定浏览器窗口本身的大小,但可以取得页面视口的大小

调整浏览器窗口大小:

resizeTo()接受新宽度和新高度

resizeBy()接受新窗口与就窗口的宽度和高度差

5.导航和打开窗口

window.open():4个参数,通常只需传入第一个参数,一个url

(有些浏览器默认不允许对主浏览器窗口调整大小和移动位置,但允许针对通过window.open()方法创建的窗口调整大小和位置,并且可以通过close()方法关闭)

var myWindow=window.open("http://www.baidu.com","_blank","height=400,width=400,top=10,left=10");

myWindow.moveTo(500,500);

myWindow.close();

6.间歇调用和超时调用

用超时调用做的图片轮换:

<html>
<body onload="myFunction()">
 <img id="image" src="" width="500px" height="500px"/>
 <script type="text/javascript">
 var img1="1.jpg";
 var img2="2.jpg";
 var img3="3.jpg";
 var imgArray=[img1,img2,img3];
 var i=0;
 function myFunction(){
	 if(i<imgArray.length){
	     document.getElementById("image").src=imgArray[i];
	     i++;
	     setTimeout(myFunction,2000);	
	 }else{
		 i=0;
		 myFunction();
	 }
 }
 </script>
</body>
</html>

7.系统对话框

alert()

confirm()

prompt()

二.location对象

1.查询字符串参数

function getStringArgs(){
    var qs=(location.search.length>0?location.search.substring(1):""),
    args={},
    items=qs.length?qs.split("&"):[],
    item=null,
    name=null,
    value=null,
    i=0,
    len=items.length;
    for(i=0;i<len;i++){
        item=items[i].split("=");
        name=decodeURIComponent(item[0]);
        value=decodeURIComponent(item[1]);
        
        if(name.length){
            args[name]=value;
        }
    }
    return args;
}

var args=getStringArgs();
args["q"];
args["num"];

2.位置方法

(1)localtion.href=”http://www.baidu.com”;

location.hash=

页面会跳转到新的URL,同时历史记录将保存上一个URL

(2)replace()

location.replace(“http://www.baidu.com”);

历史记录中将覆盖前一个URL

(3)reload()

重新加载页面

location.reload(); //可能从缓存中加载

location.reload(true); //从服务器重新加载

三.navigator对象

提供了与浏览器有关的信息

四.screen对象

保存于客户端显示器有关的信息

五.history对象

保存用户上网的历史记录

history.go(1); //前进1页

history.go(-1); //后退1页

history.back(); //后退1页

history.forward(); //前进1页

if(history.length==0){

    //用户打开窗口的第一个页面

}

原文地址:https://www.cnblogs.com/liuzhongyi1992/p/3477065.html