BOM对象处理

BOM是什么?

  • BOM是browser object model的缩写,简称浏览器对象模型
  • BOM提供了独立于内容而与浏览器窗口进行交互的对象
  • 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是- window
  • BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性
  • BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C
  • BOM最初是Netscape浏览器标准的一部分

BOM 结构示意图

这里写图片描述

很显然,BOM的核心window对象,而DOM的核心是document对象。

DOM和BOM的区别

  • DOM通过脚本动态地访问和更新文档的内容、结构以及样式的接口。
  • BOM通过脚本操作浏览器的各个功能组件的接口。
  • 区别:DOM描述了处理网页内容的接口,BOM描述了与浏览器进行交互的接口。
  • document是DOM的核心对象,window则是BOM的核心对象

window对象是什么?

Window对象表示当前浏览器的窗口,是JavaScript的顶层对象,我们创建的所有对象、函数、变量都是Window对象的成员。
一般情况下我们的代码中省略了window对象,浏览器默认会作为window对象的成员来调用。

window对象的常用属性

  • defauleStatus :指定窗口状态栏中的信息。
  • status :指定当前窗口状态栏中的信息。
  • frames :是一个数组,其中内容是窗口中所有的框架。
  • parent :指当前窗口的父窗口。
  • self :指当前窗口。
  • top :代表当前所有窗口的最顶层

window对象的常用函数

  • alert() : 显示带有一个“确定”按钮的对话框。
  • confirm() : 显示带有“确定”与“取消”两个按钮的对话框。
  • prompt() : 显示带有输入区的对话框。
  • open() :打开一个新窗口。
  • close() :关闭用户打开的窗口。

window对象常用的事件

  • onload() 装载完成后触发 。
  • onunload() 退出时触发 。
  • onbeforeunload() 退出时触发,会发生在onunload之前。
  • onfocus() 获得焦点时触发 。
  • onblur() 失去焦点时触发。
  • onerror() 错误时触发。
  • onresize() 改变大小时触发。
  • onscroll() 滚动时触发 。
  • onmove() 当对象移动时触发。

document对象常用属性

  • cookie
  • title
  • URL

location对象是什么?

location用于获取或设置窗体的URL,并且可以用于解析URL,是BOM中最重要的对象之一
location既是window对象的属性又是document对象的属性

location对象的属性

  • host :返回域名
  • hostname :返回主域名
  • port :返回URL中的端口
  • pathname :返回URL中域名后的部分
  • search :返回URL中的查询字符串
  • hash :返回URL中#符号后面的内容
  • href :返回当前文档的完整URL或设置当前文档的URL

location对象方法

  • assign():设置当前文档的URL
  • replace():设置当前文档的URL,并在history对象的地址列表中删除这个URL
  • reload():重新载入当前文档(从server服务器端)
  • toString():返回location对象href

frames对象是什么?

frames用于表现HTML页面当前窗体的中的框架集合
框架集引用中使用的对象
- window : 当前框架
- top : 最顶层的框架,就是浏览器窗体
- parent : 包含当前框架的父框架
- self : 当前框架,总是等于window对象
- frameset元素:表示一个框架集(frameset元素与body元素不能共存)
- frame元素:frameset的子元素

navigator对象通常用于检测浏览器与操作系统的版本

appCodeName:浏览 器代 码 名的字符串表示(在所有以 Netscape 代码为基础的浏览器中,它的值是 “Mozilla”。为了兼容起见,在 Microsoft的浏览器中,它的值也是 “Mozilla”)
appName:官方浏览器名的字符串表示
appVersion:浏览 器版本信息的字符串表示
cookieEnabled:如果启用cookie返回true,否则返回false
javaEnabled():如果启用java返回true,否则返回false
userAgent:用户代理头的字符串表示

history对象是什么?

history用于窗体中的导航。
浏览者通常可以使用浏览器的前进与后退按钮访问曾经浏览过的页面。JavaScript的history对象记录了用户曾经浏览过的页面,并可以实现浏览器前进与后退相似的导航功能

history对象属性

length:history 对象中缓存了多少个URL

history对象方法
  • history.go() :前 进 或后退指定的 页 面数
  • history.back() :后退一页
  • history.forward() :前进一页

screen对象是什么

screen对象用于获取用户的屏幕信息

screen 对象属性

availHeight:窗口可以使用的屏幕高度,单位像素
availWidth:窗口可以使用的屏幕宽度,单位像素
height:屏幕的高度,单位像素
width:屏幕的宽度,单位像素

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值