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

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

  • 百度百科

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

  • 我的理解

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

  • 图解BOM

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操作DOM技巧总结》、《JavaScript页面元素操作技巧总结》、《JavaScript事件相关操作与技巧大全》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript错误与调试技巧总结》

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

赞 (0)

相关推荐

  • JavaScript 浏览器对象模型BOM使用介绍

    JavaScript 浏览器对象模型BOM使用介绍

    BOM也叫做浏览器对象模型,它提供了很多对象,用于访问浏览器的功能;这些功能与任何网页内容无关; BOM缺少规范,每个浏览器提供商都按照自己的想法去扩展它,那么浏览器共有对象就成了事实的标准; 一 window对象 // BOM的核心对象是window,它表示浏览器的一个实例; // window对象处于JavaScript结构的最顶层; // 对于每个打开的窗口,系统都会自动为其定义window对象; // window对象同时扮演着ECMAScript中Global对象的角色,因此所有在全局

  • JS中的BOM应用

    JS中的BOM应用

    我们曾经讲过JS由三部分组成,其中一个部分就是BOM,用于对浏览器进行操作.这节课我们主要就来介绍BOM. BOM基础 我们先来看一个BOM的最基础功能:打开.关闭窗口: <html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <body> <input type="button" value=&quo

  • 实现JavaScript的组成----BOM和DOM详解

    我们知道,一个完整的JavaScript的实现,需要由三部分组成:ECMAScript(核心),BOM(浏览器对象模型),DOM(文档对象模型). 今天主要学习BOM和DOM. BOM: BOM提供了很多对象,用来访问浏览器的功能,这些功能于网页内容无关(这些是DOM的事),目前,BOM已经被W3C搬入了HTML5规范中. window对象: BOM的core,表示浏览器的一个实例,它既是通过javascript访问浏览器窗口的一个接口,又是ECMAScript规定的Global对象,这意味着在

  • 深入学习JavaScript中的bom

    BOM(Broswer Object Model) 凡是 window 的属性和方法,均可以省略"window." 方法: 框窗 1.警告框 window.alert("msg"); 2.确认框 window.confirm("msg"); 3.询问框 window.prompt("msg","defaulvalue") 页面 1.打开一个窗口 window.open() 2.在子窗口中使用,表示父窗口的w

  • javascript的BOM汇总

    setTimeout() //延时器,只执行一次代码 clearTimeout() //清除演示器 setIntervla() //定时器,根据指定时间间隔执行一次代码 clearInterval() //清除定时器 window.history.length //访问的历史页面的数目 window.history.forward() //前一页 window.history.back(); //后一页 window.history.go(-1); //跳转至曾经访问过的某个页面,负值表示向后跳

  • javascript中BOM基础知识总结

    一.什么是BOM BOM(Browser Object Document)即浏览器对象模型. BOM提供了独立于内容 而与浏览器窗口进行交互的对象: 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是window: BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性: BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C,BOM最初是Netscape浏览器标准的一部分. 二.学习BOM学什么 我们将学到与浏览器窗口交互的一些对象,例如

  • JS中BOM相关知识点总结(必看篇)

    JS中BOM相关知识点总结(必看篇)

    window对象 ECMAScript是JavaScript的核心,但是如果要在web中使用javascript,那么BOM(浏览器对象模型)才是真正的核心.BOM提供了很多对象,用于访问浏览器的功能,这些功能与任何网页内容无关. window对象:BOM的核心对象是window,它表示浏览器的一个实例.在浏览器中,window对象有双重角色,它既是通过javascript访问浏览器窗口的一个接口,又是ECMAScript规定的Global对象. 因此,所有全局作用域中声明的变量.函数都会变成w

  • Javascript之BOM(window对象)详解

    ECMAScript是JavaScript的核心,但在web使用JavaScript,那么BOM(浏览器对象模型)才是真正的核心. BOM的核心对象是window,它表示浏览器的一个实例. 在浏览器中,window对象既是JavaScript访问浏览器窗口的一个接口,又是ECMAScript规定的Global对象.也就是说,在网页中定义的任何一个变量.对象和函数以window作为其Global对象. 1.全局作用域 既然window对象扮演着Global对象,那么所有在全局作用域中声明的对象.变

  • javascript bom是什么及bom和dom的区别

    javascript bom是什么及bom和dom的区别

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

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

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

    本文实例讲述了JavaScript中BOM对象原理与用法.分享给大家供大家参考,具体如下: 百度百科 BOM(Browser Object Model) 是指浏览器对象模型,是用于描述这种对象与对象之间层次关系的模型,浏览器对象模型提供了独立于内容的.可以与浏览器窗口进行互动的对象结构.BOM由多个对象组成,其中代表浏览器窗口的Window对象是BOM的顶层对象,其他对象都是该对象的子对象. 我的理解 博主是这么理解的,BOM对象指的是window对象,而window对象并不是JavaScrip

  • JavaScript中localStorage对象存储方式实例分析

    本文实例讲述了JavaScript中localStorage对象存储方式.分享给大家供大家参考,具体如下: [Local storage limitations]文章中提及JavaScript里的local storge的限制,例子中在localStorage里存储了一个bool型的数据,但是却没有像我们期待的一样进行存储. 当我们存储布尔型,数值型,字符串型时,localStorage对象会将我们存储的数据默认转为字符串字面量. localStorage[0] = false;// "fals

  • Javascript中函数名.length属性用法分析(对比arguments.length)

    本文实例分析了Javascript中函数名.length属性用法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"&g

  • javascript中String对象的slice()方法分析

    本文较为详细的分析了javascript中String对象的slice()方法.分享给大家供大家参考.具体分析如下: 此方法截取字符串中的一段,并返回由被截取字符组成的新字符串. 注:原字符串不会发生改变,返回值是一个新产生的字符串. 语法结构: 复制代码 代码如下: stringObject.slice(start,end) 参数列表: 参数 描述 start  必需.规定从何处开始截取字符串.字符串的首字符的位置是0. 如果此参数为负数,那么将从字符串的尾部开始计算位置.例如:-1代表倒数第

  • Javascript中数组sort和reverse用法分析

    本文实例讲述了Javascript中数组sort和reverse用法.分享给大家供大家参考.具体分析如下: sort() 方法用于对数组的元素进行排序. reverse()将数组中的元素逆序 首先我们来试试以下这段代码: 复制代码 代码如下: var values = [1, 0, 5, 15, 10]; values.reverse(); console.log(values); 输出结果会是什么呢: [ 10, 15, 5, 0, 1 ] reverse()也就是很简单的把数组倒过来而已,那

  • java类和对象原理与用法分析

    本文实例讲述了java类和对象原理与用法.分享给大家供大家参考,具体如下: 面向对象编程OOP 类:相似对象的集合. 对象 对象:实体.一切可以被描述的事物. 属性:特征. 方法:动作,行为. 类和对象的区别 [1]类时抽象的,对象是具体的. [2]类是一个模板,创建出来的对象具备共同的属性和方法. [3]类是一种数据烈性.引用数据类型. 语法 public classs 类名{ //定义属性部分 属性1的类型 属性1: 属性2的类型 属性2: ... 属性3的类型 属性n; //定义方法部分

  • javascript中Number对象的toString()方法分析

    本文实例讲述了toString()方法的定义和用法.分享给大家供大家参考.具体分析如下: 此方法可以把Number对象转换成字符串,并返回此字符串. 语法结构如下: 复制代码 代码如下: NumberObject.toString(radix) 参数列表: 参数 描述 radix 可选.规定表示数字的基数,使2 ~ 36 之间的整数.若省略该参数,则使用基数10.但是要注意,如果该参数是10以外的其他值,则ECMAScript标准允许实现返回任意值. 实例代码如下: 复制代码 代码如下: var

  • JavaScript寄生组合式继承原理与用法分析

    JavaScript寄生组合式继承原理与用法分析

    本文实例讲述了JavaScript寄生组合式继承.分享给大家供大家参考,具体如下: 寄生组合式继承 寄生组合式继承,就是通过伪造对象来继承属性,通过原型链的混成形式来继承方法. 这种技术的基本思路是:不必为了指定子类型的原型而调用超类型的构造函数,因为我们所需要的只是超类型原型的一个副本而已(这一点正是组合继承的问题,并且正是JavaScript这种原型式语言的强大之处,直接copy对象-原型对象).本质上,就是使用寄生式继承来继承超类型的原型,然后再将结果指定给子类型的原型. function

  • javascript中cookie对象用法实例分析

    本文实例讲述了javascript中cookie对象用法.分享给大家供大家参考.具体如下: 属性 name          唯一必须设置的属性,表示cookie的名称 expires       指定cookie的存活周期,如不设置,浏览器关闭自动失效 path           决定cookie对于服务器对于其他网页的可用性,一般情况下,   cookie对同一目录下的所有页面都可用,当设置path属性后,cookie只对指定路径及子路径下的所有网页有效 domain           

  • JavaScript中BOM,DOM和事件的用法详解

    JavaScript中BOM,DOM和事件的用法详解

    目录 BOM 概念 对象组成 Window:窗口对象 Location:地址栏对象 History:历史记录对象 DOM 概念 W3C DOM 标准被分为 3 个不同的部分 核心DOM模型 HTML DOM 事件监听机制 概念 常见的事件 事件简单学习 BOM 概念 BOM全称Browser Object Model浏览器对象模型,将浏览器的各个组成部分封装成对象. 对象组成 Window:窗口对象 Navigator:浏览器对象 Screen:显示器屏幕对象 History:历史记录对象 Lo

随机推荐