JavaScript中BOM对象原理与用法分析


Posted in Javascript onJuly 09, 2019

本文实例讲述了JavaScript中BOM对象原理与用法。分享给大家供大家参考,具体如下:

  • 百度百科

BOM(Browser Object Model) 是指浏览器对象模型,是用于描述这种对象与对象之间层次关系的模型,浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成,其中代表浏览器窗口的Window对象是BOM的顶层对象,其他对象都是该对象的子对象。

  • 我的理解

博主是这么理解的,BOM对象指的是window对象,而window对象并不是JavaScript内置的对象,而是浏览器生成的对象。如果需要了解内置对象的话,可以翻阅我的另一篇博文。

  • 图解BOM

BOM对象还分为以下这几个子对象,说实话,图有点丑,下面我将详细的介绍一下这几个子对象。

JavaScript中BOM对象原理与用法分析

  • window对象

常用操作

window.alert('hello');//弹出警告框
window.confirm(text);//弹出确认对话框,返回布尔值
window.prompt(text,defaultstr);//弹出输入框,并返回输入内容
window.close();//关闭当前页面
window.print();//打印操作

注意:在申明变量的时候,所有在最外层申明的变量(非函数中)都属于window对象的属性,比如。

<script>
var str = 'China';//最外层变量,就是window对象的属性
console.log(str);//输出:China
console.log(window.str);//输出:China
</script>
  • navigator对象(包含浏览器信息的对象)

常用属性

appCodeName:内部代码
appName:浏览器名称
cookieEnabled:cookie是否可用
userAgent:用户代理信息

  • location对象(浏览器地址栏对象)

常用属性

host:主机名
href:地址链接,可以使用此属性实现页面跳转
pathname:地址路径
search:参数信息

页面跳转

window.location.href='http://www.webbc.win';//页面跳转
  • history对象(历史记录对象)

属性

length:历史记录的数目

常用方法

back():后退一页
forword():前进一页
go(num):指定跳转到哪一页,如果参数是正数就代表向前翻一页,如果是负数代表向后翻一页

  • screen 屏幕对象

常用属性

height:高度
width:宽度
availHeight:可用高度
availWidth:可用宽度

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
几个javascript操作word的参考代码
Oct 26 Javascript
锋利的jQuery jQuery中的DOM操作
Mar 21 Javascript
js实现日历可获得指定日期周数及星期几示例分享(js获取星期几)
Mar 14 Javascript
Javascript 绘制 sin 曲线过程附图
Aug 21 Javascript
JS修改地址栏参数实例代码
Jun 14 Javascript
JS随机打乱数组的方法小结
Jun 22 Javascript
微信小程序 开发指南详解
Sep 27 Javascript
微信小程序 轮播图swiper详解及实例(源码下载)
Jan 11 Javascript
jquery实现自适应banner焦点图
Feb 16 Javascript
js 获取元素的具体样式信息getcss(实例讲解)
Jul 05 Javascript
浅析js中mvvm模式实现的原理
Oct 06 Javascript
详解webpack打包第三方类库的正确姿势
Oct 20 Javascript
jquery多级树形下拉菜单的实例代码
Jul 09 #jQuery
vue 组件中使用 transition 和 transition-group实现过渡动画
Jul 09 #Javascript
详解vue 2.6 中 slot 的新用法
Jul 09 #Javascript
JavaScript中var的重要性实例分析
Jul 09 #Javascript
js图片无缝滚动插件使用详解
May 26 #Javascript
vue中datepicker的使用教程实例代码详解
Jul 08 #Javascript
微信小程序实现类似微信点击语音播放效果
Mar 30 #Javascript
You might like
php 显示指定路径下的图片
2009/10/29 PHP
ThinkPHP CURD方法之data方法详解
2014/06/18 PHP
浅谈php中curl、fsockopen的应用
2016/12/10 PHP
PHP读取CSV大文件导入数据库的实例
2017/07/24 PHP
PHP封装的非对称加密RSA算法示例
2018/05/28 PHP
Jquery cookie操作代码
2010/03/14 Javascript
jquery实现效果比较好的table选中行颜色
2014/03/25 Javascript
js实现tab切换效果实例
2015/09/16 Javascript
JQuery组件基于Bootstrap的DropDownList(完整版)
2016/07/05 Javascript
详解webpack-dev-server使用http-proxy解决跨域问题
2018/01/13 Javascript
利用CDN加速react webpack打包后的文件详解
2018/02/22 Javascript
150行代码带你实现微信小程序中的数据侦听
2019/05/17 Javascript
如何使用50行javaScript代码实现简单版的call,apply,bind
2019/08/14 Javascript
[02:36]DOTA2英雄基础教程 斯拉克
2013/11/29 DOTA
[50:22]完美盛典-2018年度红毯走秀
2018/12/16 DOTA
python三元运算符实现方法
2013/12/17 Python
python使用新浪微博api上传图片到微博示例
2014/01/10 Python
python中list常用操作实例详解
2015/06/03 Python
Python使用email模块对邮件进行编码和解码的实例教程
2016/07/01 Python
Django 前后台的数据传递的方法
2017/08/08 Python
Python读取properties配置文件操作示例
2018/03/29 Python
在Python中COM口的调用方法
2019/07/03 Python
python的几种矩阵相乘的公式详解
2019/07/10 Python
django项目简单调取百度翻译接口的方法
2019/08/06 Python
django基于存储在前端的token用户认证解析
2019/08/06 Python
python脚本后台执行方式
2019/12/21 Python
canvas线条的属性详解
2018/03/27 HTML / CSS
农田水利实习自我鉴定
2013/09/19 职场文书
本科生职业生涯规划书范文
2014/01/21 职场文书
新品发布会主持词
2014/04/02 职场文书
全国文明单位申报材料
2014/05/31 职场文书
关于美容院的活动方案
2014/08/14 职场文书
广告设计专业毕业生自我鉴定
2014/09/27 职场文书
个人批评与自我批评发言稿
2014/09/28 职场文书
党员民主生活会对照检查材料思想汇报
2014/09/28 职场文书
python 三边测量定位的实现代码
2021/04/22 Python