JS—浏览器对象

1.window对象是最顶层的对象
2.window对象有6大属性
（document,frames,history,location,navigator,screen），这6大属性本身也是对象
3.window对象旗下的document属性也是对象，并且document对象旗下也有5大属性，同时也是对象。（anchors,forms,images,links,location）

• 弹出框
  alert('这是一个含有一段消息，以及一个确认按钮的警告框')
  confirm('这是一个含有一段消息以及一个确认按钮和一个取消按钮的对话框')
  prompt('这是一个提示框','');//返回输入的值，第一个参数是说明，第二个参数是输入框的默认值
  特点：
  confirm()返回一个布尔值，如果用户点击确定按钮则返回true，如果取消或关闭则返回false。
  prompt()返回用户的输入值。

• 使用率不高
  print()//调出打印
  find()//调出查找
  defaultStatus='lee';//设置默认值永久的
  status='xxx';//只是设置暂时
  另外关于status，有些浏览器已经取消了状态条的设置，所以不建议使用，

• open()
  open('http://www.baidu.com','baidu','width=400,height=400,top=100,left=100,location=no,toolbar=no')
  特点：一般接收三个参数
  第一参数：要加载的URL，
  第二个参数：窗口名称或窗口目标,可以给新窗口设置一个名称，凡是以这个名称打开的窗口都会在这个名称下打开目标：_blank新建一个窗口，_parent表示在本窗口内加载，
  第三个参数表示各种参数的设置
  上面的例子中使用的第二个参数是名称

• opener
  这个属性时子窗口控制父窗口的一个接口。
  可以在子窗口的js内写下这么一段代码，来向父窗口内添加内容。
  document.onclick=function(){
  window.opener.document.write('ddd')
  }

• 获取窗口位置
  这个存在兼容问题
  //获取窗口的位置的兼容做法
  var leftX=typeof window.screenLeft=='number'?window.screenLeft:screenX;
  var topY=typeof window.screenTop=='number'?window.screenTop:screenY;
  alert('X:'+leftX+'Y:'+topY)
  特点：由于火狐不支持.screenLeft这个方法，所以通过选择判断语句来进行判断，如果不支持那么就选择火狐支持的screenX，如果直接用这个属性，但是IE又不支持。

• 获取可视窗口大小
  同样这个也存在兼容问题
  //获取可视窗口大小的兼容做法
  var width=window.innerWidth;
  var height=window.innerHeight;
  if(typeof width!='number'){
  if(document.compatMode=='CSS1Compat'){
  width=document.documentElement.clientWidth;
  height=document.documentElement.clientHeight;
  }else{
  width=document.body.clientWidth;
  height=document.body.clientHeight;
  }
  }
  特点：innerWidth为可视窗口的宽度，outerWidth为可视窗口加上外边框的宽度，但是IE不支持，Chrome内二者值一样。
  对于IE，可以使用DOM的办法获取可视窗口的大小，但是对于怪异模式下的情况，还有些问题，需要将文档元素替换成body才可以。

• 超时调用定时器
  setTimeout('alert(1)',1000);//不推荐--------------------a
  function box(){
  alert(22)
  }
  setTimeout(box,2000);//不够封装-------------------------b
  setTimeout(function(){alert(22)},3000);//推荐-----------c
  var box=setTimeout(function(){alert(22)},3000);//推荐---d
  clearTimeout(box);
  特点：有以上四种做法是创建超时调用定时器的办法。
  a：不推荐是因为第一个参数如果是代码串，会造成不能使用过于复杂的代码
  b：这样将第一个参数改为函数的引用，但是却显得不够封装
  c：这是推荐做法，足够封装，但是会影响消除
  d：这个就够啦，当需要消除时，直接把值传过去就消除啦

• 间歇调用定时器
  var box=setInterval('alert(2)',2000)
  clearInterval(box);
  这个的使用方法可超时调用时一样的，这个会每隔一段时间来调用一个函数
  利用这两个定时器，可以分别完成一个倒数计时器的效果，不过推荐使用超时定时器来做
  var num=0,max=5,id=null;
  function box(){
  num++;
  var i=0;
  i+=num;
  document.getElementById('a').innerHTML=i;
  if(num==max){
  clearInterval(id);
  alert('5秒到啦');
  }
  }
  id=setInterval(box,1000);

    //使用超时调用模拟
    var num=0,max=5,id=null;
    function box(){
        num++;
        var i=0;
        i+=num;
        document.getElementById('a').innerHTML=i;
        if(num==max){
            clearTimeout()
            alert('5秒到啦');
        }else{
            setTimeout(box,1000)
        }
    }
    setTimeout(box,1000)
  

这两种方法都可以使用c方法来封装，只不过，为了便于观看，我分开写了。

• location
  这个对象既是window的属性对象也是document的属性对象。不过他们包含的属性还是一样的
  alert(window.location)
  alert(window.document.location)
  值相等，均表示当前网页的链接
  • .hash
    这个属性表示页面的标签值
    location.hash='#ee'
    alert(location.hash);
    我们有时候会看到某个链接后面会附上#admin来标识该网页，通过为网页链接上附上不同的标签值，可以使用前进后退来查看，不同标示符下的网页（这个我还不知道具体用途，）
• 获取键值
  //获取键值
  //http://192.168.1.103:8020/1AAA%E5%89%8D%E7%AB%AF/Test/js/BOM/window/window.html?id=222&search=hudhu
  function getArgs(){
  var args={};
  var qs=location.search.length>0?location.search.substring(1):'';
  var items=qs.split('&');
  for(var i=0;i var item=items[i].split('=');
  args[item[0]]=item[1];
  }
  return args;
  }
  var args=getArgs();
  alert(args['id'])
  alert(args['search'])
  特点:这个主要是location.search属性的使用，这个属性返回一个字符串，是（？……）即包括问号在内的链接后面的参数。可以通过这个方法来获取传递的参数。
• 重新加载
  location.reload();
  location.reload(true);
  不传递参数true表示在缓存中加载网页，加上参数true表示重新向服务器获取。
• 替代
  location.replace('http://www.baidu.com');//不产生任何历史记录
  这个的意思是，通过使用这个办法可以直接定向的某个网页，但是后退后无法返回。即不产生相应的历史记录。
• .href
  这个就是定向网页啦，最常用的
  location.href('http://www.baidu.com')
• history
• .length用于显示当前窗口的历史记录一共有几次
  alert(history.length)
• .back .next用于指定当前窗口向前或向后浏览历史记录
  function back(){
  history.back();
  }
  history.next()
• .go()用于指定当前窗口向前或向后浏览指定的历史记录
  history.go(3)；//前进3页历史记录
  history.go(-3)；//倒退3页历史记录

这些并不全，也不是所有最常用的，还有几个window对象是用来检测浏览器的，下一篇笔记再来写