BOM总结

  BOM(浏览器对象模型),提供了独立于页面内容而与浏览器窗口进行交互的对象。使用BOM,开发者可以移动窗口、改变状态栏的文本以及执行其他与页面内容不直接的动作。BOM由一系列相关的对象构成。

一、window 对象

  window对象是整个BOM的核心,所有对象和集合都以某种方式与window对象关联。

1.窗口操作

  window对象调整窗口的大小和位置:

    1)window.moveBy(dx,dy)--将浏览器窗口相对当前位置水平或垂直移动(px)到指定的距离(相对定位);

    2)window.moveTo(x,y)--移动浏览器窗口,使它的左上角位于屏幕的(x,y)处,可使用负数(绝对定位);

    3)window.resizeBy(dw,dh)--相对于浏览器窗口当前的大小改变为指定的宽度和高度(px),当为负数时,窗口则缩小(相对调整窗口大小)

    4)window.resizeTo(w,h)--调整窗口为指定的宽度和高度,不能为负数。

2.打开新窗口

  height:窗口的高度,单位像素;

  width:窗口的宽度,单位像素;

  Left:窗口的左边缘位置;

  top:窗口的上边缘位置;

  fullscreen:是否全屏,默认值no;

  location:是否显示地址栏,默认值yes;

  menubar:是否显示菜单栏,默认值yes;

  resizable:是否允许改变窗口大小,默认值yes;

  scrollbars:是否显示滚动条,默认值yes;

  status:是否显示状态栏,默认值yes;

  titlebar:是否显示标题栏,默认值yes;

  toolbar:是否显示工具条,默认值yes;

3.系统对话框

  1)window.alert--显示消息提示框

    Window.alert([message])

  2)window.confirm--显示一个确认提示框,点击Ok按钮是返回true,点击Cancel按钮时返回false;

    window.confirm([message])

  3)window.prompt--显示一个文本输入消息框,此方法接受两个参数,即要显示给用户的文本和文本框中的默认文本(可为空);

    window.prompt([message],[default])

4.状态栏

  浏览器状态的显示信息可以通过window.status属性直接进行修改。

    window.status="[message]"

5.时间间隔和暂停

  定时操作通常有两种使用目的,一种是周期性的执行脚本,如时钟;另一种则是将某个操作延时一段时间执行。window.setTimeout函数使其延时执行,且后面脚本正常运行。

  1)window.setInterval--用于设置定时器,每隔一段时间执行指定代码;

    window.setInterval(执行代码,等待的毫秒数)

  2)window.clearInterval--用于清除setInterval函数设定的定时器;

    window.clearInterval(阻止执行的代码id)

  3)window.setTimeout--用于设置定时器,在一段时间之后执行指定代码;

    window.setTimeout(执行代码,等待的毫秒数)

  4)window.clearTimeout--用于清除setTimeout函数设定的定时器;

    window.clearTimeout(阻止执行的代码id)

6.历史

  window.history访问浏览器窗口的历史,可使用length属性查看历史中的页面数,alert(history.length);

  window.history.go(前进为正数/后退为负数)/history.go(前进为正数/后退为负数)

  history.back()--返回一页

  history.forward()--前进一页

二、document 对象

  document 对象实际上是window 对象的属性,window 对象的任何属性和方法都可以直接访问。

  document 对象的集合:

  anchors:页面中所有锚的集合(由<a name=”anchorname”></a>表示);

  applets:页面中所有applet的集合;

  embeds:页面中所有嵌入式对象的集合(由<embed/>标签表示);

  forms:页面中所有表单的集合;

  images:页面中所有图像的集合;

  links:页面中所有链接的集合(<a href=”somewhere.html”></a>表示);

1)document.write/writeIn()--在当前文档中输入文字(writeIn比write末尾多一个换行);

  document.write/writeIn(text)

2 )document.open和document.close是一组方法,通常与document.write/writeIn方法配合使用。

  document.open--打开文档准备写入内容;

  document.close--用于关闭文档,同时将写出内容输出到页面;

三、location 对象

  location.href是最常用的属性,用于获取或设置窗口的URL,改变该属性的值,就可导航到新的页面:

  location.href=”http://www.baidu.com/“;

  location.assign()方法实现的是同样的操作:

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

  location.reload()方法有两种模式,即从浏览器缓存中重载(false),或从服务器端重载(true);

四、navigator 对象

  navigator 对象包含了关于Web浏览器的信息,浏览器的类型、版本信息都可以从对象中获取。

五、screen 对象

  screen 对象用于获取某些关于用户屏幕的信息;

  screen 对象的属性:

  availHeight:窗口可以使用的屏幕高度(px),其中包括操作系统元素(如window工具栏)需要的空间;

  availWidth:窗口可以使用的屏幕宽度(px);

  colorDepth:用户表示颜色的位数;

  height:屏幕的高度(px);

  width:屏幕的宽度(px);

原文地址:https://www.cnblogs.com/LeeX/p/4082506.html