浏览器对象模型BOM小结
概念
BOM (Browser Object Model) 浏览器对象模型
BOM提供了独立于内容而与浏览器窗口进行交互的对象
BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是window
BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C,
BOM最初是Netscape浏览器标准的一部分;
window对象 是浏览器中的Global对象
窗口设置 (打开、大小、位置)
间歇调用与超时调用
对话框 (提示框、确认框、输入框)
location对象 (位置对象包含各种属性和方法)
navigator对象 用于提供用户浏览器的相关信息
screen对象 包含有关用户屏幕的信息
history对象 包含有关用户的访问历史记录
打开新窗口
window.open(URL,name,specs);
URL:打开页面的URL,没有指定URL将打开新的空白窗口
name:
_blank 新窗口打开,默认
_self 当前页面打开
name 窗口名称 ......
specs:一个逗号分隔的项目列表。支持以下值:
height=pixels 窗口的高度,最小值为100
width=pixels 窗口的宽度,最小值为100
left=pixels top=pixels ......
示例 window.open('','','width=200,height=200');
关闭窗口
window.close() 方法用于关闭浏览器窗口
(DOM window对象的方法)
close() 方法将关闭有 window 指定的顶层浏览器窗口。
某个窗口可以通过调用 self.close() 或只调用 close() 来关闭其自身。
只有通过 JavaScript 代码打开的窗口才能够由 JavaScript 代码关闭。
这阻止了恶意的脚本终止用户的浏览器。
窗口大小
调整窗口大小 window.resizeTo(width,height);
调整窗口大小 window.resizeBy(width,height);
窗口位置
window.screenLeft属性返回窗口相对于屏幕的X坐标
window.screenTop属性返回窗口相对于屏幕的Y坐标
window.screenX属性返回窗口相对于屏幕的X坐标
window.screenY属性返回窗口相对于屏幕的Y坐标
窗口可视区尺寸
document.documentElement.clientWidth //offset 获取的是整个文档的高度
document.body.clientWidth
document.documentElement.clientHeight
document.body.clientHeight
窗口垂直滚动条
document.body.scrollTop
document.documentElement.scrollTop
间歇调用
setInterval ( 函数/名称 , 毫秒数 )
表示每经过一定的毫秒后,执行一次相应的函数(重复)
超时调用
setTimeout ( 函数/名称 , 毫秒数 )
表示经过一定的毫秒后,只执行一次相应的函数(不重复)
清除计时器:clearInterval( ); clearTimeout( );
提示框 alert (“ ”);
用户必须先关闭该消息框然后才能继续进行操作
确认框 confirm(“ ”);
confirm(“需要确认的内容”);
选择“确定”返回true 选择“取消”返回false
输入框 prompt(“ ”,“ ”);
prompt(“对话框中显示的文本”,"默认的输入文本");
单击取消按钮,则返回 null 单击确认按钮,则返回输入的文本
location对象 包含有关当前页面的URL信息
属性:
host 设置或返回主机名和当前 URL 的端口号。
port 设置或返回当前 URL 的端口号。
href 设置或返回完整的 URL。 ……
方法:
assign() 加载新的文档。
reload() 重新加载当前文档。
replace() 用新的文档替换当前文档。
navigator对象部分属性
appCodeName 返回浏览器的代码名。
appName 返回浏览器的名称。
cookieEnabled 返回指明浏览器中是否启用cookie的布尔值。
platform 返回运行浏览器的操作系统平台。
appVersion 返回浏览器的平台和版本信息。
userAgent 返回由客户机发送服务器的user-agent头部的值。
用户浏览器识别码
var str=window.navigator.userAgent;
var str=window.navigator.appVersion;
大小写转换
str.toLowerLocalCase( ); 转换成小写
str.toUpperLocalCase( ); 转换成大写
indexOf( )方法
可返回某个指定的字符串值在字符串中首次出现的位置
语法:string.indexOf(str,index);
参数:str-------规定需检索的字符串值
index----规定在字符串中开始检索的位置
注意:indexOf( ) 方法对大小写敏感 如果要检索的字符串值没有出现,则该方法返回 -1
screen 对象包含有关客户端显示屏幕的信息
width 返回显示器屏幕的宽度。
height 返回显示器屏幕的高度。
availHeight 返回显示屏幕的高度 (除 Windows 任务栏之外)。
availWidth 返回显示屏幕的宽度 (除 Windows 任务栏之外)。
history 对象包含用户在浏览器中访问过的URL
length 返回浏览器历史列表中的 URL 数量。
back() 加载 history 列表中的前一个 URL。
forward() 加载 history 列表中的下一个 URL。
go() 加载 history 列表中的某个具体页面。
history.go(-1) 后退一页
history.go(1) 前进一页
http://www.cnblogs.com/paulirish/ 大家可以去这个博客看一下,里面有操作代码;
浏览器对象模型BOM小结的更多相关文章
- 浏览器对象模型BOM
第二章 浏览器对象模型BOM 1.作用:操作窗口:提供导航对象:提供定位对象:浏览器上方的地址栏:提供跟屏幕相关对象:提供对Cookie的支持 2.根元素:window:代表整个窗口:window,o ...
- 浏览器对象模型BOM(Browser Object Model)
1.结构 BOM是Browser Object Model的缩写,简称浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是w ...
- JavaScript编程:浏览器对象模型BOM
4.浏览器对象模型BOM: document.body.offsetwidth可以获取浏览器宽度. Window对象: 窗口操作: 1.moveBy(dx,dy ...
- JavaScript 浏览器对象模型 (BOM)
浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器“对话”. 浏览器对象模型 (BOM) 浏览器对象模型(Browser Object Model)尚无正式标准. 由于现代浏览器已经 ...
- JavaScript高级程序设计(第3版)学习笔记·第8章——浏览器对象模型BOM
转自:http://www.shaoqun.com/a/43768.aspx 访问和操作浏览器窗口的模型称为浏览器对象模型BOM(Browser Object Model),但习惯上是把所有针对浏览器 ...
- 浏览器对象模型bom的作用是什么?
浏览器对象模型bom的作用是什么? 零.总结 1.BOM提供了独立于内容而与浏览器窗口进行交互的对象 2.BOM提供了一些访问窗口对象的一些方法,我们可以用它来移动窗口位置,改变窗口大小,打开新窗口和 ...
- 浏览器对象模型(BOM)是什么?(体系结构+知识详解)(图片:结构)
浏览器对象模型(BOM)是什么?(体系结构+知识详解)(图片:结构) 一.总结 1.BOM操作所有和浏览器相关的东西:网页文档dom,历史记录,浏览器屏幕,浏览器信息,文档的地址url,页面的框架集. ...
- js浏览器对象模型-BOM
bom browse object model 浏览器对象模型. 也就是window对象下面的东西. location 对象 window.location.href 表示打开窗口的路径. windo ...
- 浏览器对象模型(BOM)
BOM结构 用户浏览网页的时候,浏览器会自动创建一些对象,这些对象存放着浏览器窗口的属性和相关信息,也就是大家熟称的BOM.浏览器对象模型是一个层次化的对象集,我们可以通过window对象访问所有对象 ...
随机推荐
- MySQL字段自增长AUTO_INCREMENT的学习笔记
1.创建表时指定AUTO_INCREMENT自增值的初始值(即起始值): CREATE TABLE XXX (ID INT(5) PRIMARY KEY AUTO_INCREMENT) AUTO_IN ...
- php函数parse_url
1.需求 了解parse_url的使用方法 2.实例 $uri = parse_url('http://dummy'.$_SERVER['REQUEST_URI']); var_dump($uri); ...
- word201612012
I/O (input/output) port / 输入/输出端口 IAS, Internet Authentication Service / Internet 验证服务 ICMP, Interne ...
- (原)android的alertdialog中加入edittext但是不弹出软键盘等问题的解决与原因
摘要:alertdialog中加入edittext但是不弹出软键盘等问题网上有很多不管用的解决方案, 本文意在给出更有效的解决办法,并初步探究其原因 正文 在对话框中插入文本框是十分常见的需求 通常我 ...
- mysql 最大连接数 & 连接池
MySQL最大连接数 关于最大连接数:http://mg123.lofter.com/post/1a5f3e_996f838 可以通过修改配置文件(默认/etc/my.cnf)中的"mysq ...
- 【Python】自动生成html文件查看指定目录中的所有图片
获取本目录下的pic子目录中的所有图片(jpg,png,bmp,gif等,此处以jpg文件为例),然后生成一个image.html文件,打开该html文件即可在浏览器中查看pic子目录中的所有图片. ...
- request response
request 和 response 这两个对象是出现在service方法中.service方法是用来接收请求处理请求,完成响应的. 接受请求指的就是request对象 完成响应指的就 ...
- JavaScript高级程序设计学习笔记--DOM
DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序接口). Document类型 文档的子节点 虽然DOM标准规定Document节点的子节点可以是DocumentType,Ele ...
- 使用emIDE创建STM32项目
emIDE是一个开源的嵌入式集成开发环境,基于Code::Blocks开发,能够支持多个平台和多个厂家的嵌入式硬件,继承了Code::Blocks的有点. 下载emIDE并安装,也可选择绿色版.若需要 ...
- iOS创建自定义的xib视图,不带控制器调用
1 我们平常使用视图都是在控制器中加载各种视图,但是有时候一个单独的视图,弄一个控制器未免有些显得太沉重了,所以我们现在来创建一个带xib加载视图的自定义视图 2 创建一个视图类集成uiview 3 ...