javascript之BOM


学习要点:

  BOM介绍

  Window对象

一、BOM介绍

  浏览器对象模型简称为BOM(Brower Object Model),BOM由很多对象构成,对象与对象之间有着相互联系。

  BOM结构示意图如下:

  

二、Window对象

  Window对象是一个全局对象,是所有对象的顶级对象。对于每个打开的窗口,系统都会自动为其定义 window 对象。

1、Window对象的属性和方法

  

属性

含义

closed

当窗口关闭时为真

defaultStatus

窗口底部状态栏显示的默认状态消息

document

窗口中当前显示的文档对象

frames

窗口中的框架对象数组

history

保存有窗口最近加载的URL

length

窗口中的框架数

location

当前窗口的URL

name

窗口名

offscreenBuffering

用于绘制新窗口内容并在完成后复制已存在的内容,控制屏幕更新

opener

打开当前窗口的窗口

parent

指向包含另一个窗口的窗口(由框架使用)

screen

显示屏幕相关信息,如高度、宽度(以像素为单位)

self

指示当前窗口。

status

描述由用户交互导致的状态栏的临时消息

top

包含特定窗口的最顶层窗口(由框架使用)

window

指示当前窗口,与self等效

  

方法

功能

alert(text)

创建一个警告对话框,显示一条信息

blur()

将焦点从窗口移除

clearInterval(interval)

清除之前设置的定时器间隔

clearTimeOut(timer)

清除之前设置的超时

close()

关闭窗口

confirm()

创建一个需要用户确认的对话框

focus()

将焦点移至窗口

open(url,name,[options])

打开一个新窗口并返回新window对象

prompt(text,defaultInput)

创建一个对话框要求用户输入信息

scroll(x,y)

在窗口中滚动到一个像素点的位置

setInterval(expression,milliseconds)

经过指定时间间隔计算一个表达式

setInterval(function,millisenconds,[arguments])

经过指定时间间隔后调用一个函数

setTimeout(expression,milliseconds)

在定时器超过后计算一个表达式

setTimeout(expression,milliseconds,[arguments])

在定时器超过时后计算一个函数

print()

调出打印对话框

find()

调出查找对话框

  2、Window对象事件

  常用的Window对象事件包括blur、error、focus、load、move、resize和unload七种。

  (1)、装载/卸载文档

    Window对象中的load事件通常作用在BODY元素中,也可以作用在IMG元素中。当作用在BODY元素中时,只有当整个网页都加载完毕后才会被激发。

    与load事件相反,unloaded事件是在浏览器窗口卸载文档时激发的事件。以下3种操作会激发unloaded事件:

    文档从一个内容换到另一个;浏览器关闭;刷新浏览器窗口。

  (2)、得到焦点与失去焦点

    当浏览器窗口得到焦点时可以触发focus事件,得到焦点是指浏览器窗口为当前的活动窗口。

    当浏览器窗口失去焦点时可以触发blur事件。

  (3)系统对话框

    警告框:window.alert(message);

    确认框:window.confirm(message);

    提示框:window.prompt(message,defaultText);defaultText参数值为提示框的输入框的默认文字。

  (4)新开窗口

    window.open(url,windowName,features,replace)

  (5)、移动窗口

    window.moveTo(x,y);//绝对位置

    window.moveBy(x,y);//相对位置

  (6)调整窗口大小

      window.resizeTo(x,y);//绝对大小

    window.resizeBy(x,y);//相对大小

  (7)、超时与时间间隔

    window.setTimeout(code,delay);//延迟代码的执行时间

    window.clearTimeout(id);//取消延迟代码的执行时间,id为setTimeout()方法的返回值。

    window.setInterval(code,interval);//周期性执行代码

    window.clearInterval(id;//停止周期性执行代码,id为setInterval()方法的返回值。


javascript基础学习(十一)的更多相关文章

  1. JavaScript 基础学习1-day14

    JavaScript 基础学习1 知识预览JavaScript概述二 JavaScript的基础三 JavaScript的对象BOM对象DOM对象实例练习js扩展 JavaScript概述 JavaS ...

  2. 48.javascript基础学习

    javascript基础学习:   http://www.w3school.com.cn/jsref/index.asp jS的引入方式: 1.行间事件:为某一个具体的元素标签赋予js内容,oncli ...

  3. JavaScript 基础学习(二)js 和 html 的结合方式

    第一种 使用一个标签 <script type="text/javascript"> js代码; </script> 第二种 使用 script 标签,引入 ...

  4. JavaScript 基础 学习 (四)

    JavaScript 基础 学习 (四) 解绑事件 dom级 事件解绑 ​ 元素.on事件类型 = null ​ 因为赋值的关系,所以给事件赋值为 null 的时候 ​ 事件触发的时候,就没有事件处理 ...

  5. JavaScript 基础 学习(三)

    JavaScript 基础 学习(三) 事件三要素 ​ 1.事件源: 绑定在谁身上的事件(和谁约定好) ​ 2.事件类型: 绑定一个什么事件 ​ 3.事件处理函数: 当行为发生的时候,要执行哪一个函数 ...

  6. JavaScript 基础 学习 (二)

    JavaScript 基础 学习 节点属性 ​ 每一个节点都有自己的特点 ​ 这个节点属性就记录着属于自己节点的特点 1. nodeType(以一个数字来表示这个节点类型) ​ 语法:节点.nodeT ...

  7. JavaScript 基础 学习 (一)

    JavaScript 基础 学习 获取页面中的元素的方法 作用:通过各种方式获取页面中的元素 ​ 比如:id,类名,标签名,选择器 的方式来获取元素 ​ 伪数组: ​ 长的和数组差不多,也是按照索引排 ...

  8. 几张非常有意义的JavaScript基础学习思维图

    分享几张对于学习JavaScript基础知识非常有意义的图,无论你的JavaScript级别如何,“温故而知新”完全可以从这些图中得到. 推荐理由:归类非常好,非常全面 JavaScript 数组 J ...

  9. JavaScript基础 学习笔记

    参考资料 视频链接:https://www.bilibili.com/video/BV1Sy4y1C7ha?spm_id_from=333.999.0.0 菜鸟教程:https://www.runoo ...

随机推荐

  1. SaltStack Syndic配置

    参考URL: http://www.ttlsa.com/saltstack/saltstack-syndic-example/ 虽然中心master看不到 minion的key 但是还是可以直接指导m ...

  2. IIC协议及其对ACK应答信号的处理

    1,SCL一直由Master控制,SDA依照数据传送的方向,读数据时由Slave控制SDA,写数据时由Master控制SDA.当8位数据传送完毕之后,应答位或者否应答位的SDA控制权与数据位传送时相反 ...

  3. c# 哈希表集合;函数

    * 哈希表集合 1.先进去的后出来,最后进去的先出来 2.利用枚举类型打印出集合中的Key值和Value值 ** 函数 1.函数:能够独立完成某项功能的模块. 函数四要素:输入.输出.函数体.函数名 ...

  4. thinkphp中的session()方法

    系统提供了Session管理和操作的完善支持,全部操作可以通过一个内置的session函数完成. 用法 session($name, $value='') 参数 name(必须):如果传入数组 则表示 ...

  5. shell command使用技巧

    1窗口可以merge 2.可以通过 control+t打开窗口

  6. sudo and su

    sudo bash : change the current user into root su u1: change the current user into u1 useradd: add ne ...

  7. JDK安装配置与升级

    一.jdk1.4卸载 Redhat Enterprise 5 中自带安装了jdk1.4,在安装jdk1.6前,把jdk1.4卸载: 1. 首先查看系统自带的JDK版本: [root@linux ~]# ...

  8. 测试使用wiz来发布blog

    晚上尝试了下用wiz写随笔并发布,貌似成功了,虽然操作体验和方便性上不如word,但起码它集成了这个简单的功能可以让我用:如果能让我自动新建blog文章并自动定时更新发布就完美了.2013年7月5日1 ...

  9. 《编写高质量代码——Web前端开发修炼之道》读后随笔

    结构样式行为的分离 结构标准包括XML标准.XHTML标准.HTML标准:样式标准有CSS标准:行为标准主要包括DOM标准和ECMAScript标准. 通常的项目会按照如上的方式进行分离,但自己曾今做 ...

  10. 虚拟机linux配置nginx 为什么win7通过Ip访问不到

    第一步,你应该先检查网络win机ping linux机,通了进行下一步第二步,检查端口netstat -antl | grep 你开启的服务端口比如你开了http,那就是80端口或者你自定义的端口,我 ...