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效率调优经验
Jun 04 Javascript
js 巧妙去除数组中的重复项
Jan 25 Javascript
异步javascript的原理和实现技巧介绍
Nov 08 Javascript
JQuery操作三大控件(下拉,单选,复选)的方法
Aug 06 Javascript
深入理解JavaScript中的传值与传引用
Dec 09 Javascript
JS代码防止SQL注入的方法(超简单)
Apr 12 Javascript
angular-ui-sortable实现可拖拽排序列表
Dec 28 Javascript
JS设置手机验证码60s等待实现代码
Jun 14 Javascript
webpack开发跨域问题解决办法
Aug 03 Javascript
Vue2.0实现将页面中表格数据导出excel的实例
Aug 09 Javascript
Vue实现内部组件轮播切换效果的示例代码
Apr 07 Javascript
基于vue展开收起动画的示例代码
Jul 05 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中的串行化变量和序列化对象
2006/09/05 PHP
jQuery+php实现ajax文件即时上传的详解
2013/06/17 PHP
使用PHP实现Mysql读写分离
2013/06/28 PHP
PHP的fsockopen、pfsockopen函数被主机商禁用的解决办法
2014/07/08 PHP
php实现多维数组排序的方法示例
2017/03/23 PHP
JS构建页面的DOM节点结构的实现代码
2011/12/09 Javascript
js操作table示例(个人心得)
2013/11/29 Javascript
深入理解JavaScript中的传值与传引用
2013/12/09 Javascript
jQuery的each终止或跳过示例代码
2013/12/12 Javascript
JavaScript实现随机替换图片的方法
2015/04/16 Javascript
js仿小米官网图片轮播特效
2016/09/29 Javascript
jQuery基本选择器和层次选择器学习使用
2017/02/27 Javascript
详解JavaScript按概率随机生成事件
2017/08/02 Javascript
详解webpack+express多页站点开发
2017/12/22 Javascript
vue实现组件之间传值功能示例
2018/07/13 Javascript
nodejs同步调用获取mysql数据时遇到的大坑
2019/03/02 NodeJs
vue权限问题的完美解决方案
2019/05/08 Javascript
js实现滑动滑块验证登录
2020/07/24 Javascript
简单了解JavaScript作用域
2020/07/31 Javascript
[01:20]DOTA2 2017国际邀请赛冠军之路无止竞
2017/06/19 DOTA
Python判断以什么结尾以什么开头的实例
2018/10/27 Python
python3.6中@property装饰器的使用方法示例
2019/08/17 Python
python中如何进行连乘计算
2020/05/28 Python
Python DES加密实现原理及实例解析
2020/07/17 Python
Python 实现PS滤镜的旋涡特效
2020/12/03 Python
Python命令行参数argv和argparse该如何使用
2021/02/08 Python
唤醒头发毛囊的秘密武器:Grow Gorgeous
2016/08/28 全球购物
Ray-Ban雷朋西班牙官网:全球领先的太阳眼镜品牌
2018/11/28 全球购物
理肤泉英国官网:La Roche-Posay英国
2019/01/14 全球购物
护理工作感言
2014/01/16 职场文书
学校安全教育制度
2014/01/31 职场文书
中学生自我鉴定
2014/02/04 职场文书
明信片寄语大全
2014/04/08 职场文书
2014年班级工作总结
2014/11/14 职场文书
参观邀请函范文
2015/02/02 职场文书
Android存储中最基本的文件存储方式
2022/04/30 Java/Android