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 相关文章推荐
JQuery学习笔录 简单的JQuery
Apr 09 Javascript
用js判断页面是否加载完成实现代码
Dec 11 Javascript
js 点击页面其他地方关闭弹出层(示例代码)
Dec 24 Javascript
JavaScript中Function详解
Feb 27 Javascript
对象题目的一个坑 理解Javascript对象
Dec 22 Javascript
解决node.js安装包失败的几种方法
Sep 02 Javascript
通过函数作用域和块级作用域看javascript的作用域链
Aug 05 Javascript
layui弹出层按钮提交iframe表单的方法
Aug 20 Javascript
JS滚轮控制图片缩放大小和拖动的实例代码
Nov 20 Javascript
微信小程序之下拉列表实现方法解析(附完整源码)
Aug 23 Javascript
在vue中使用jsx语法的使用方法
Sep 30 Javascript
微信小程序获取公众号文章列表及显示文章的示例代码
Mar 10 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
Smarty结合Ajax实现无刷新留言本实例
2007/01/02 PHP
php4与php5的区别小结(配置异同)
2011/12/20 PHP
php的闭包(Closure)匿名函数详解
2015/02/22 PHP
完美解决phpdoc导出文档中@package的warning及Error的错误
2016/05/17 PHP
PHP将URL转换成短网址的算法分享
2016/09/13 PHP
一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
2009/05/21 Javascript
让js弹出窗口居前显示的实现方法
2013/07/10 Javascript
关闭ie窗口清除Session的解决方法
2014/01/10 Javascript
js实现简洁的滑动门菜单(选项卡)效果代码
2015/09/04 Javascript
利用jQuery实现漂亮的圆形进度条倒计时插件
2015/09/30 Javascript
jQuery配合coin-slider插件制作幻灯片效果的流程解析
2016/05/13 Javascript
node.js中 stream使用教程
2016/08/28 Javascript
微信小程序 wx.request(object) API详解及实例代码
2016/09/30 Javascript
KnockoutJS 3.X API 第四章之表单submit、enable、disable绑定
2016/10/10 Javascript
easyUI combobox实现联动效果
2017/01/17 Javascript
js提取中文拼音首字母的封装工具类
2018/03/12 Javascript
Vue.js上传图片到阿里云OSS存储的方法示例
2018/12/13 Javascript
React 全自动数据表格组件——BodeGrid的实现思路
2019/06/12 Javascript
LayUI数据接口返回实体封装的例子
2019/09/12 Javascript
Python编码时应该注意的几个情况
2013/03/04 Python
在Python的Django框架中更新数据库数据的方法
2015/07/17 Python
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
python安装twisted的问题解析
2018/08/21 Python
PyQt5多线程刷新界面防假死示例
2019/12/13 Python
对Tensorflow中Device实例的生成和管理详解
2020/02/04 Python
tensorflow实现从.ckpt文件中读取任意变量
2020/05/26 Python
python 实现性别识别
2020/11/21 Python
Python3利用scapy局域网实现自动多线程arp扫描功能
2021/01/21 Python
Python的两道面试题
2013/06/29 面试题
计算机开发个人求职信范文
2013/09/26 职场文书
消防器材管理制度
2014/01/28 职场文书
公司领导九九重阳节发言稿2014
2014/09/25 职场文书
上课说话检讨书500字
2014/11/01 职场文书
五年级学生评语大全
2014/12/26 职场文书
工作犯错保证书
2015/05/11 职场文书
幼儿园大班教育随笔
2015/08/14 职场文书