BOM的核心对象是window,它既表示浏览器窗口以及页面可见区域,同时也是ECMAScript中的Globe对象,所有的全局变量和函数都是它的属性,并且所有的原声函数以及其他函数也都存在于它的命名空间下。

一,window窗口相关设置

1)获取浏览器窗口在显示屏的位置

根据浏览器不同,可以采用screenLeft,screenTop或者screenX,screenY,跨浏览器的代码如下:

//获取浏览器的位置
var leftPos=(typeof window.screenLeft =='number')?window.screenLeft:window.screenX;
var topPos=(typeof window.screenTop =='number')?window.screenTop:window.screenY;

2)移动浏览器窗口的位置

moveTo,moveBy.不过该方法一般浏览器是禁用的

3)获取浏览器窗口大小,以及浏览器页面视口的大耵浏览器窗口的大小

不同浏览器的实现方法不同,最终无法确定浏览器窗口本身的大小,但是可以取得页面视口的大小

//获取浏览器视口的位置
var pageWidth=document.innerWidth;
var pageHeight=document.innerHeight;
if(typeof pageWidth!="number"){
    if(document.compatMode=="CSS1Compat"){
        pageWidth=document.documentElement.clientWidth;
        pageHeight=document.documentElement.clientHeight;
    }else{
        pageWidth=document.body.clientWidth;
        pageHeight=document.body.clientHeight;
    }
}
alert(pageWidth+","+pageHeight);

4)调整浏览器窗口大小

可以利用resizeTo()和resizeBy()两个方法,不过这个方法一般也是被禁用的。

二、window相关的全局对象

1.location对象

1)location即是window的属性,也是document的属性,代表当前页面的访问地址

2)locaiton可以通过host,href,pathname,protocol,search等属性,访问当前url地址的相关字段

3)location可以改变当前的访问地址。多采用location.href="新地址"

4)location.reload()重新加载页面

2.navigation对象

代表浏览器应用,可以查询浏览器的版本,名称等。在实际中应用不多。

3.history对象

该对象保存着用户的上网历史,history.go(-n),history.go(n),如果仅仅前进/后退一步,可以使用back(),forward(),来模仿浏览器的前进/后退操作。

三、window相关的全局函数

1.Math,Date等对象提供的相关工具函数

2.window.open()弹出框函数,该方法可以导航到一个特定的url,可以打开一个新的浏览器窗口,接受四个参数,URL,窗口目标,一个特性字符串("_self,_blank,_parent等"),以及是否在浏览器历史记录中记录当前加载页面的布尔值。有些时候,弹出窗会受限于浏览器的安全限制。

3.间歇调用和超时调用

setTimeOut():接受两个参数,函数以及经过多长时间后该函数被调用

setInterVal():接受两个参数,函数以及每间隔多长时候该函数被调用一次

4,系统相关对话框

alert(),confirm(),prompt()

这几个对话框的外观由浏览器决定,而不是由css决定,同时,这些对话框都是同步和模态的,也就是说,显示这些对话框的时候,代码会停止运行,直到关闭这些对话框。

JavaScript学习笔记之BOM的更多相关文章

  1. JavaScript学习笔记之BOM对象

    目录 1.Window 2.Window Screen 3.Window Location 4.Window History 5.Window Navigator 浏览器对象模型(Browser Ob ...

  2. JavaScript学习笔记(13)——BOM

    1.window 所有浏览器都支持window对象,它表示浏览器窗口本身. 所有 JavaScript 全局对象.函数以及变量均自动成为 window 对象的成员. 全局变量是 window 对象的属 ...

  3. Java程序猿的JavaScript学习笔记(汇总文件夹)

    最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...

  4. Java程序猿的JavaScript学习笔记(8——jQuery选择器)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  5. Java程序猿JavaScript学习笔记(2——复制和继承财产)

    计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...

  6. Java程序猿的JavaScript学习笔记(3——this/call/apply)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  7. Java程序猿JavaScript学习笔记(4——关闭/getter/setter)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

  8. Java程序猿JavaScript学习笔记(14——扩大jQuery UI)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

  9. javascript学习笔记(四) Number 数字类型

    数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数  toExponential() 方法 用科学 ...

随机推荐

  1. HDU 2159 FATE(二维费用背包)

    FATE Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Submi ...

  2. PHP 错误与异常 笔记与总结(6)将错误日志保存在系统日志中

    [将错误记录到系统日志中] 在 php.ini 中将 error_log 设置为: error_log = syslog 或者在运行时使用 ini_set() 函数设置. [例1] <?php ...

  3. JS中基本window对象操作

    ---恢复内容开始--- 一.使用window中的属性时   window.属性,直接跟属性名.而调用window的函数时  window.hanshu(): 要在其函数名后面加括号. 二.windo ...

  4. Android获取手机制作商,系统版本等

    在开发中 我们有时候会需要获取当前手机的系统版本来进行判断,或者需要获取一些当前手机的硬件信息. android.os.Build类中.包括了这样的一些信息.我们可以直接调用 而不需要添加任何的权限和 ...

  5. Iphone H5上传照片被旋转

    最近做项目发现在Iphone下,我们上传图片都会被翻转,最后查阅资料发现,的确是IOS的问题 不说过程,直接解决方法 iOS下,html方式使用<input type="file&qu ...

  6. linux实现c多进程

    线程(thread)技术早在60年代就被提出,但真正应用多线程到操作系统中去,是在80年代中期,solaris是这方面的佼佼者.传统的Unix也支持线程的概念,但是在一个进程(process)中只允许 ...

  7. Redis学习笔记--五种数据类型的使用场景

    String 1.String 常用命令: 除了get.set.incr.decr mget等操作外,Redis还提供了下面一些操作: 获取字符串长度 往字符串append内容 设置和获取字符串的某一 ...

  8. Let's Encrypt这个免费的证书签发服务

    使用的是Let's Encrypt这个免费的证书签发服务,按照这里的教程一步步照着来,很快就完成了. 迁移过程总体来说比较顺利,只是遇到了两个不大不小的坑.一个是域名的跳转问题,迁移完成以后对于所有h ...

  9. 【Android开发学习笔记】【随笔】UI线程

    概念 UI线程 是Android中的主线程,涉及到UI方面的一些操作都需要在ui线程中进行操作 在非ui线程中想操作ui,就会报错 android.view.ViewRoot$CalledFromWr ...

  10. Linq&Lumda---LINQ to DataSet的DataTable操作

    1. DataTable读取列表 DataSet ds = new DataSet();// 省略ds的Fill代码DataTable products = ds.Tables["Produ ...