JavaScript中的BOM对象

BOM(Browser Object Model):浏览器对象模型

BOM可用于对浏览器窗口进行访问,但BOM没有相关的标准,所以根据浏览器的不同,其中定义的对象属性和方法可能会有所不同。

BOM对象也就是我们所说的宿主对象,总共分为五类:Window、Navigator、Screen、History、Location。

一、Window对象

Window 对象表示浏览器中打开的窗口

1、特点

Window对象是全局对象,所有的表达式都可以再当前的环境中计算。因此,Window对象的属性和方法都可以直接使用,下面两种方式效果是一样的:

window.alert(123);	//1
alert(123); //2

2、方法

弹出框相关

  1. alert():显示带有一段消息和一个确认按钮的警告框
  2. confirm():显示带有一段消息以及确认按钮和取消按钮的消息框(方法返回值:确定为true,取消为false)。
  3. prompt():显示可提示用户输入的对话框(返回值:用户输入的值)

打开关闭相关

  1. close():调用者是谁,就close谁的窗口。
  2. open():打开一个新的浏览器窗口,将会返回新的Window对象。

定时器相关

  1. setTimeout(code,millisec):在(millisec) 毫秒数后执行(code),只执行一次!

    • 参数

      • code:js代码或方法对象
      • millisec:毫秒值。
    • 返回值:返回唯一标识ID,用于clearTimeout()方法取消指定的定时器。
  2. clearTimeout(id_of_settimeout):取消由 setTimeout() 方法设置的定时器。
    • 参数

      • id_of_settimeout :传入setTimeout方法的返回值id,取消该定时器。
  3. setInterval(code,millisec):每隔(millisec)毫秒就执行(code),除非被clearInterval()取消,否则不会停。
  4. clearInterval(id_of_setinterval):取消由 setInterval() 设置的定时器。

下面两个参数、返回值和上面相同,区别在于:前者是一次性的计时,后者是循环的计时

以下代码源自W3School:

<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
{
var t=new Date()
document.getElementById("clock").value=t
}
</script>
<button onclick="int=window.clearInterval(int)">Stop interval</button>

3、属性

  1. 其他BOM对象:history、location、Screen、Navigator
  2. DOM对象:document

意思是:通过window对象可以方便的操纵其他BOM对象和DOM对象,我们之前见过的document.write(123);其中的DOM对象document就是通过Window全局对象来调用的。

二、Location对象

Location 对象包含有关当前 URL 的信息。

方法

reload():重新加载当前文档,即刷新界面。

属性

href:可读可写,意味着既可以设置新的URL,也可以返回当前完整的URL。

三、History对象

History对象包含用户在浏览器窗口中访问过的URL。

方法

  1. back():加载 history 列表中的前一个 URL。
  2. forward():加载 history 列表中的下一个 URL。
  3. go():加载 history 列表中的某个具体页面。

属性

length:返回当前窗口历史列表中的URL数量

四、Screen对象

Screen 对象包含有关客户端显示屏幕的信息。

五、Navigator

Navigator 对象包含有关浏览器的信息。


参考链接:W3School--BOM

【学习笔记】:JavaScript中的BOM对象的更多相关文章

  1. Javascript学习1 - Javascript中的类型对象

    原文:Javascript学习1 - Javascript中的类型对象 1.1关于Numbers对象. 常用的方法:number.toString() 不用具体介绍,把数字转换为字符串,相应的还有一个 ...

  2. JS 学习笔记--JS中的事件对象基础

    事件:JavaScript中的事件是由访问web页面用户的一系列操作引起的,比如点击鼠标,键盘按键等.当用户执行某些操作的时候再去执行一些代码. 事件模型:内联模型.脚本模型.DOM2模型 内联模型: ...

  3. js学习笔记----JavaScript中DOM扩展的那些事

    什么都不说,先上总结的图~   Selectors API(选择符API) querySelector()方法 接收一个css选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回null ...

  4. 读书笔记-JavaScript中的全局对象

    对于任何JavaScript程序,当程序开始运行时,JavaScript解释器都会初始化一个全局对象以供程序使用.这个JavaScript自身提供的全局对象的功能包括: 1.全局对象拥有一些常用的属性 ...

  5. HTML 学习笔记 JavaScript (Math和Number对象)

    标签: Math对象:数学对象,提供对数据的数学计算.如:获取绝对值,向上取整等.无构造函数,无法被初始化,只提供静态属性和方法. Number对象:Js中提供的数字的对象.包含整数,浮点数等等.并提 ...

  6. javascript中的BOM对象

    1.window对象 所有的浏览器都支持window对象 概念上讲,一个html文档对应一个window对象 功能上讲,控制浏览器窗口 使用上讲,window对象不需要创建对象,直接使用 2.wind ...

  7. Javascript高级编程学习笔记(31)—— BOM(5)screen、history对象

    screen对象 screen对象应该是BOM对象中最不常用的对象了 其主要用于提供客户端的显示能力信息 包括浏览器外部显示的信息,和像素的宽高等 这个对象的主要用于检测客户端能力,一般不会影响功能 ...

  8. JavaScript学习笔记(十五)——对象之Date,RegExp

    在学习廖雪峰前辈的JavaScript教程中,遇到了一些需要注意的点,因此作为学习笔记列出来,提醒自己注意! 如果大家有需要,欢迎访问前辈的博客https://www.liaoxuefeng.com/ ...

  9. 学习笔记---Javascript事件Event、IE浏览器下的拖拽效果

    学习笔记---Javascript事件Event.IE浏览器下的拖拽效果     1. 关于event常用属性有returnValue(是否允许事件处理继续进行, false为停止继续操作).srcE ...

随机推荐

  1. 实验五:配置Eth-Trunk链路聚合(手工负载分担模式)

    1.配置图 2.配置命令 LSW1的eth trunk 1配置如下: 配置命令如下: [S1]Eth-Trunk1 创建Eth-Trunk1端口 [S1-Eth-Trunk1]mode lacp-st ...

  2. 关于PDF阅读器

    获取流程 1.点击下载xodo 2.跳转到如下界面,单击箭头所指的版本: 3.单击转到 中国-中文 4.点击获取 5.在跳出来的界面点击红框 6.打开本机的Microsoft Store下载应用 介绍 ...

  3. Ninject 初步 -Getting Started with Ninject 精通ASP-NET-MVC-5-弗瑞曼 Listing 6-10

  4. Ubuntu16手动安装OpenStack——nova篇。。转

    前言: 本文转自https://www.voidking.com/dev-ubuntu16-manual-openstack-nova/ ,过程非常的详细,作者也说本实验最终失败,因为课程要求我们只要 ...

  5. 1-3课 介绍虚拟化技术、在虚拟机中安装windows7

    虚拟化技术 可以使我们在同一台计算机上运行多个操作系统 用于教学环境 用于测试环境 和硬件无关  可移植到其他电脑直接使用 Ptov技术  不支持VtoP 节省管理成本 节省硬件投资  不用买设备 省 ...

  6. 谈谈 InnoDB引擎中的一些索引策略

    如果我们在工作能够更好的利用好索引,那将会极大的提升数据库的性能. 覆盖索引 覆盖索引是指在普通索引树中可以得到查询的结果,不需要在回到主键索引树中再次搜索 建立如下这张表来演示覆盖索引: creat ...

  7. Scala 学习(7)之「trait (1) 」

    作为接口使用 在 triat 中可以定义抽象方法,就与抽象类中的抽象方法一样,只要不给出方法的具体实现即可 类可以使用 extends 关键字继承 trait,注意,这里不是 implement,而是 ...

  8. php--->注册模式

    注册模式 什么是注册树模式? 注册树模式当然也叫注册模式,注册器模式.注册树模式通过将对象实例注册到一棵全局的对象树上,需要的时候从对象树上采摘的模式设计方法. 优点:单例模式解决的是如何在整个项目中 ...

  9. CTF--HTTP服务--PUT上传漏洞

    开门见山 1. 扫描靶机ip,发现PCS 192.168.31.48 2. 用nmap扫描靶机的开放服务和版本信息 3. 再扫描全部信息 4. 用nikto探测靶机http服务敏感信息 5. 再用di ...

  10. shiro 基础使用

    引 言 相关内容 : https://blog.csdn.net/superyayaya/article/details/94408805 在web 中, 不同角色的用户, 具有不同的访问权限, 有的 ...