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 表单之间的数据传递代码
Dec 04 Javascript
基于JQuery的简单实现折叠菜单代码
Sep 15 Javascript
jquery无刷新验证邮箱地址实现实例
Feb 19 Javascript
js实现简单div拖拽功能实例
May 12 Javascript
Javascript实现图片轮播效果(二)图片序列节点的控制实现
Feb 17 Javascript
jQuery获取file控件中图片的宽高与大小
Aug 04 Javascript
实例分析JS与Node.js中的事件循环
Dec 12 Javascript
详解Nuxt.js部署及踩过的坑
Aug 07 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
Dec 28 Javascript
学习LayUI时自研的表单参数校验框架案例分析
Jul 29 Javascript
webpack的 rquire.context用法实现工程自动化的方法
Feb 07 Javascript
Vue路由守卫及页面登录权限控制的设置方法(两种)
Mar 31 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数据库连接时容易出错的特殊符号问题
2010/09/01 PHP
PHP 显示客户端IP与服务器IP的代码
2010/10/12 PHP
php 函数中使用static的说明
2012/06/01 PHP
php中socket的用法详解
2014/10/24 PHP
javascript:window.open弹出窗口的位置问题
2014/03/18 Javascript
js实现弹出窗口、页面变成灰色并不可操作的例子分享
2014/05/10 Javascript
JavaScript创建对象的方式小结(4种方式)
2015/12/17 Javascript
jQuery Mobile页面返回不需要重新get
2016/04/26 Javascript
JavaScript中的boolean布尔值使用学习及相关技巧讲解
2016/05/26 Javascript
jQuery时间验证和转换为标准格式的时间格式
2017/03/06 Javascript
解决vue单页使用keep-alive页面返回不刷新的问题
2018/03/13 Javascript
中级前端工程师必须要掌握的27个JavaScript 技巧(干货总结)
2019/09/23 Javascript
[01:24:09]Ti4 冒泡赛第二轮DK vs C9 1
2014/07/14 DOTA
[01:37]全新的一集《真视界》——TI7总决赛
2017/09/21 DOTA
[02:09]2018DOTA2亚洲邀请赛TNC赛前采访
2018/04/04 DOTA
python封装对象实现时间效果
2020/04/23 Python
Python入门篇之函数
2014/10/20 Python
Python利用operator模块实现对象的多级排序详解
2017/05/09 Python
简单了解什么是神经网络
2017/12/23 Python
python2.6.6如何升级到python2.7.14
2018/04/08 Python
python针对不定分隔符切割提取字符串的方法
2018/10/26 Python
python实现可逆简单的加密算法
2019/03/22 Python
详解程序意外中断自动重启shell脚本(以Python为例)
2019/07/26 Python
python hmac模块验证客户端的合法性
2020/11/07 Python
python使用requests库爬取拉勾网招聘信息的实现
2020/11/20 Python
HTML5中input[type='date']自定义样式与日历校验功能的实现代码
2017/07/11 HTML / CSS
方太官方网上商城:销售方太抽油烟机、燃气灶、消毒柜等
2017/01/17 全球购物
颇特女士香港官网:NET-A-PORTER香港
2021/03/08 全球购物
计算机通信工程专业毕业生推荐信
2013/12/24 职场文书
县人大领导班子四风对照检查材料思想汇报
2014/10/09 职场文书
个人学习群众路线心得体会
2014/11/05 职场文书
模范班主任事迹材料
2014/12/17 职场文书
党员转正介绍人意见
2015/06/03 职场文书
Python之matplotlib绘制折线图
2022/04/13 Python
Java 多线程并发FutureTask
2022/06/28 Java/Android
JS实现九宫格拼图游戏
2022/06/28 Javascript