关于BOM的那些事儿

window对象
1.window对象是最顶层的对象
2.window对象有六大属性，这六大属性本身也是对象
3.window对象旗下的document也是对象 并且document旗下有五大属性
4.document旗下的五大属性又是对象，总结：都是对象

Window screenLeft 和 screenTop 属性(Window screenLeft 和 screenTop 属性返回窗口相对于屏幕的X和Y座标)

//其它浏览器都支持 screenLeft 和 screenTop两个属性 但是Firefox不支持；可以通过screenX 和 screenY 获取火狐的座标，但是IE又不支持screenX ，screenY ,所以提供下面跨浏览器获取座标的方法

//跨浏览器操作
 var i= typeof window.screenLeft=='number'?window.screenLeft:window.screenX;
 var e= typeof window.screenTop=='number'?window.screenLeft:window.screenY;
 alert(i);
 alert(e);

跨浏览器获取可视窗口的范围

//跨浏览器获取可视范围的窗口

var width= window.innerWidth;    //ie不支持 
var height = window.innerHeight;   //支持inner的就使用这个
//不支持的就是用document对象的方法  （所有的都支持）
if(typeof width!='number'){
  if(document.compatMode=='CSSCompt'){   //标准兼容模式下
    width= document.documentElement.clientWidth;
    height = document.documentElement.clientHeight;
  }else{     //非
     width=  document.body.clientWidth;
     height =  document.body.clientHeight;  
}
}
alert(width);
alert(height);

计时器
1.超时调用

var box=setTimeout(function(){  
  alert('Lee');
},2000);
clearTimeout(box); //取消当前的超时调用计划

2.间歇调用

var box=setInterval(function(){   
  alert('Lee');
},1000)

clearInterval(box);

//使用超时调用 模拟定时器
var num = 0;
var max = 5;  
function box () {
  num++;
  document.getElementById('a').innerHTML += num;
  if(num==max){ 
    alert('5秒到了！');   
  }else{
    setTimeout(box,1000);     //不超过5秒就调用本身
  }
}
setTimeout(box,1000);

location对象

//location对象 是window的属性 也是document的属性
alert(window.location);    //与下面等效 获取当前的url
alert(window.document.location);

location.href='http://ww.baidu.com';   //跳转到指定的url
 location.assign('http://www.baidu.com');  //跳转
location.reload();   //重新加载 有可能是从缓存里面加载
location.reload(true);   //强制从源头加载

function a(){
  location.replace('http://www.baidu.com');   //不产生任何历史痕迹的跳转
}

history对象

function back(){     
  history.back();   //跳转到前一个URL
}

function forward(){
  history.forward();    //跳转到后一个URL
}

function go(num) {
  history.go(num); //go(-1)相当于history.back()  go(1)相当于history.forward()
}