BOM简介

来源:互联网 发布:什么决定命运知乎 编辑:程序博客网 时间:2024/06/08 01:53
1. BOM: Browser Object Model
    专门操作浏览器窗口的API —— 没有标准
   
   window对象: 2个角色:
      1.代替Global,充当全局作用域,
包含所有全局对象,方法和变量 
      2.指代当前打开的浏览器窗口!


   属性: 
        浏览器窗口中,文档显示区的范围: 
innerHeight  innerWidth
        浏览器窗口的大小: outerHeight   outerWidth
   方法: 
    打开窗口: window.open("url","name");
        其中: 内存中,每个窗口对象都有一个唯一的name属性
             相同name属性的窗口,只能打开一个!
             后打开的会替换先打开的
             备选值: 
               _self:在当前窗口打开
               _blank: 在新窗口打开,随机分配name。默认
    关闭当前窗口: window.close();
    移动到: window.moveTo(left,top);
    改变窗口大小: window.resizeTo(newWidth,newHeight)
    


   1. 在网页中打开新连接的方式: 
     1. 替换当前窗口内容,可后退:
       html: <a href="url"></a>
       js: [window.]open("url","_self")
     2. 替换当前窗口内容,禁止后退:
       history对象: 在内存中存储当前窗口打开过的历史记录的栈结构。
       location对象: 保存当前窗口正在打开的url地址
       js:location.replace("新url");
替换history中,当前的url记录
     3. 在新窗口打开,可打开多个:
       html:<a href="url" target="_blank"></a>
       js:[window.]open("url"[,"_blank"])
     4. 在新窗口打开,仅能打开一个:  
       html:<a href="url" target="name"></a>
意为: 在名为name的新窗口打开url
          如果重复打开相同name的窗口,新打开的会替换旧的
       js:[window.]open("url","name")


   2. 窗口位置和大小:
     补: open("url","name","config")
其中config是配置窗口初始大小和位置的配置字符串: 
config="left=值,top=值,width=值,height=值"
强调:其中width,height相当于innerWidth和innerHeight


open其实会返回新打开的窗口对象


      screen对象: 保存屏幕的分辨率信息
完整屏幕宽高: screen.width  screen.height
        去掉任务栏后的剩余宽高:
          screen.availWidth  screen.availHeight


      获取鼠标相对于整个屏幕的位置: 2步:
       1. 获取事件对象e
       2. 获得相对于整个屏幕的位置: 
          e.screenX  e.screenY
0 0
原创粉丝点击