【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>>
BOM:(Browser Object Mode) 浏览器对象模型。
1. BOM是browser object model的缩写,简称浏览器对象模型
2. BOM提供了独立于内容而与浏览器窗口进行交互的对象
3. 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是window
4. BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性
5. BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C
6. BOM最初是Netscape浏览器标准的一部分
BOM中定义了6种重要的对象:
1. window对象表示浏览器中打开的窗口;
2. document对象表示浏览器中加载页面的文档对象;
3. location对象包含了浏览器当前的URL信息;
4. navigator对象包含了浏览器本身的信息;
5. screen对象包含了客户端屏幕及渲染能力的信息;
6. history对象包含了浏览器访问网页的历史信息。
在浏览器宿主环境下,window对象就是JavaScript的Global对象,因此使用window对象的属性和方法是不需要特别指明的。比如alert完整的调用形式应该是window.alert。
window对象对应着Web浏览器的窗口,使用它可以直接对浏览器窗口进行操作。window对象提供的主要功能可以分为以下5类:
1. 调整窗口的大小和位置;
2. 打开新窗口;
3. 系统提示框;
4. 状态栏控制;
5. 定时操作。
1. 调整窗口的大小和位置;
(1)window.moveBy
该方法将浏览器窗口移动指定的距离(相对定位)。
用法:window.moveBy(dx, dy)
(2)window.moveTo
该方法将浏览器窗口移动到指定的位置(绝对定位)。
用法:window.moveTo(x, y)
(3)window.resizeBy
该方法将浏览器窗口的大小改变为指定的宽度和高度(相对调整窗口大小)。
用法:window.resizeBy(dw, dh)
(4)window.resizeTo
该方法将浏览器窗口的大小改变为指定的宽度和高度(绝对调整窗口大小)。
用法:window.resizeTo(w, h)
2. 打开新窗口;
用法:window.open([url] [, target] [, options])
options参数可能的选项包括:
(1)height: 窗口的高度,单位为像素;
(2)width:窗口的宽度,单位为像素;
(3)left:窗口的左边缘位置;
(4)top:窗口的上边缘位置;
(5)fullscreen:是否全屏,默认值为no;
(6)location: 是否显示地址栏,默认值为yes;
(7)menubar: 是否显示菜单项,默认值为yes;
(8)resizable: 是否允许改变窗口大小,默认值为yes;
(9)scrollbars: 是否显示滚动条,默认值为yes;
(10)status: 是否显示状态栏,默认值为yes;
(11)titlebar: 是否显示标题栏,默认值为yes;
(12)toolbar: 是否显示工具条,默认值为yes。(7)menubar: 是否显示菜单项,默认值为yes;
(8)resizable: 是否允许改变窗口大小,默认值为yes;
(9)scrollbars: 是否显示滚动条,默认值为yes;
(10)status: 是否显示状态栏,默认值为yes;
(11)titlebar: 是否显示标题栏,默认值为yes;
(12)toolbar: 是否显示工具条,默认值为yes。
3.系统对话框;
(1)window.alert
该方法将显示消息提示框。
用法:window.alert([message])
(2)window.confir
该方法将显示一个确认提示框,其中包括“确定”和“取消”按钮。
用户单击“确定”按钮时,window.confirm返回true;单击“取消”按钮时,window.confirm返回false。
用法:window.confirm([message])
(3)window.prompt
该方法将显示一个消息提示框,其中包含一个文本输入框。
用法:window.prompt([message] [, default])
(4)状态栏控制
浏览器状态的显示信息可以通过window.status属性直接进行修改。
(5)定时操作
定时操作通常有两种使用目的,一种是周期性地执行脚本,例如在页面上显示时钟,需要每隔一秒钟更新一次,
另一种则是将某个操作延时一段时间执行,例如某个特别耗时的操作,可以使用window.setTimeout函数使其延时执行,
而后面的脚本可以继续运行不受影响。
1)window.setInterval
该函数用于设置定时器,每隔一段时间执行指定的代码。
用法:window.setInterval(code, interval)
2)window.clearInterval
该函数用于清除setInterval函数设置的定时器。
用法:window.clearInterval(timer)
3)window.setTimeout
该函数用于设置定时器,在一段时间之后执行指定的代码。
用法:window.setTimeout(code, time)
4)window.clearTimeout
该函数用于清除setTimeout函数设置的定时器。
用法:window.clearTimeout(timer)
document对象
document对象实际上是window的属性,document对象的独特之处是它既属于BOM又属于DOM。
从BOM角度看,document对象由一系列集合构成,这些集合可以访问文档的各个部分,并提供页面自身的信息。
由于BOM没有统一的标准,各种浏览器中的document对象特性并不完全相同,因此在使用document对象时需要特别注意,
尽量要使用各类浏览器都支持的通用属性和方法。
( 1)通用属性
1)document.bgColor
该属性为页面的背景色。
2)document.fgColor
该属性为页面的前景色。
3)document.linkColor
该属性为页面文档中链接的颜色。
4)document.vlinkColor
该属性为页面文档中访问过的链接颜色。
5)document.alinkColor
该属性为页面文档中激活链接的颜色。
6)document.domain
该属性为文档所在的域名。
7)document.referrer
该属性为将用户引入当前页面的URL。
8)document.URL
该属性为当前页面的URL。
9)document.title
该属性为当前页面的标题。
10)document.lastModified
该属性为上次修改页面的时间。
11)document.cookie
该属性用于设置或者读取Cookie的值。
( 2)集合属性
anchors:返回文档中所有锚的集合
说明:IE中document.anchors将返回所有具有name或者id属性的锚;而在Mozilla Firefox中
document.anchors将返回所有具有name属性的锚
applets:返回文档中所有applet的集合
embeds:返回文档中所有embed对象的集合
forms:返回文档中所有表单的集合
images:返回文档中所有img对象的集合
links:返回文档中所有链接的集合,即所有设置了href属性的<a>元素
(3)方法
1)document.write/writeln
该方法用于在当前文档中输出文字。
用法:
document.write(text)
document.writeln(text)
2)document.open
document.open和document.close是一组方法,通常与document.write/writeln方法配合使用。
其中,document.open方法用于打开文档准备写入内容。
用法:document.open()
3)document.close
该方法用于关闭文档,同时将写入的内容输出到页面。
用法:document.close()
location对象
location.hash:当前页面的URL中“#”号后面的部分
location.host:当前页面的URL中主机名和端口的部分
location.hostname:主机名
location.href:当前页面的URL
location.pathname:当前页面的相对路径
location.port:端口号
location.protocol:协议名称
location.search:当前页面的URL中问号后的部分
navigator对象
navigator对象包含了关于Web浏览器的信息,浏览器的类型、版本信息都可以从该对象中获取。
navigator.appCodeName:浏览器代码名称
navigator.appName:浏览器名称
navigator.appVersion:浏览器运行平台和版本
navigator.cookieEnabled:浏览器是否接受Cookie
screen对象
screen.height:屏幕的垂直分辨率,单位为像素
screen.width:屏幕的水平分辨率,单位为像素
screen.availHeight:可用的屏幕高度(排除操作系统元素占用的高度,如Windows任务栏的高度)
screen.availWidth:可用的屏幕宽度(排除操作系统元素占用的宽度,如Windows任务栏的宽度)
说明:通常情况下Windows任务栏位于窗口底部,此时screen.width与srceen.avialWidth相同
screen.colorDepth:屏幕的色彩深度
history对象
history.length:浏览历史记录的总数
history.go(index):从浏览历史中加载URL,index参数是加载URL的相对位置,index为负数时表示当前地 址
之前的浏览记录,index为正数时表示当前地址之后的浏览记录
history.forward():从浏览历史中加载下一个URL,相当于history.go(1)
history.back():从浏览历史中加载上一个URL,相当于history.go(-1)
来源:oschina
链接:https://my.oschina.net/u/1403140/blog/201634