javascript基础学习(十一)
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基础学习(十一)的更多相关文章
- JavaScript 基础学习1-day14
JavaScript 基础学习1 知识预览JavaScript概述二 JavaScript的基础三 JavaScript的对象BOM对象DOM对象实例练习js扩展 JavaScript概述 JavaS ...
- 48.javascript基础学习
javascript基础学习: http://www.w3school.com.cn/jsref/index.asp jS的引入方式: 1.行间事件:为某一个具体的元素标签赋予js内容,oncli ...
- JavaScript 基础学习(二)js 和 html 的结合方式
第一种 使用一个标签 <script type="text/javascript"> js代码; </script> 第二种 使用 script 标签,引入 ...
- JavaScript 基础 学习 (四)
JavaScript 基础 学习 (四) 解绑事件 dom级 事件解绑 元素.on事件类型 = null 因为赋值的关系,所以给事件赋值为 null 的时候 事件触发的时候,就没有事件处理 ...
- JavaScript 基础 学习(三)
JavaScript 基础 学习(三) 事件三要素 1.事件源: 绑定在谁身上的事件(和谁约定好) 2.事件类型: 绑定一个什么事件 3.事件处理函数: 当行为发生的时候,要执行哪一个函数 ...
- JavaScript 基础 学习 (二)
JavaScript 基础 学习 节点属性 每一个节点都有自己的特点 这个节点属性就记录着属于自己节点的特点 1. nodeType(以一个数字来表示这个节点类型) 语法:节点.nodeT ...
- JavaScript 基础 学习 (一)
JavaScript 基础 学习 获取页面中的元素的方法 作用:通过各种方式获取页面中的元素 比如:id,类名,标签名,选择器 的方式来获取元素 伪数组: 长的和数组差不多,也是按照索引排 ...
- 几张非常有意义的JavaScript基础学习思维图
分享几张对于学习JavaScript基础知识非常有意义的图,无论你的JavaScript级别如何,“温故而知新”完全可以从这些图中得到. 推荐理由:归类非常好,非常全面 JavaScript 数组 J ...
- JavaScript基础 学习笔记
参考资料 视频链接:https://www.bilibili.com/video/BV1Sy4y1C7ha?spm_id_from=333.999.0.0 菜鸟教程:https://www.runoo ...
随机推荐
- java的"=="与"equals"
equals 方法是 java.lang.Object 类的方法. 有两种用法说明: (1)对于字符串变量来说,使用“==”和“equals()”方法比较字符串时,其比较方法不同. “==”比较两个变 ...
- PGA突破pga_aggregate_target限制
SQL> show parameter pga NAME TYPE VALUE ------------------------------------ ----------- ...
- AC自动机:BZOJ 2434 阿狸的打字机
2434: [Noi2011]阿狸的打字机 Time Limit: 10 Sec Memory Limit: 256 MBSubmit: 1834 Solved: 1053[Submit][Sta ...
- HDOJ(HDU) 2309 ICPC Score Totalizer Software(求平均值)
Problem Description The International Clown and Pierrot Competition (ICPC), is one of the most disti ...
- word 2010中如何创建多级目录和多级列表
原文地址:http://wenku.baidu.com/link?url=KkSmYTqogxA5VJkLCGb957E5fIGN5S50FUx7IpAWWWKWWRYvaeGl2IvX-dFP25r ...
- 搜索——[HAOI2012]添加号
题目:[HAOI2012]添加号 描述: [题目描述] 有一个由数字1,2,…9组成的数字串(长度不超过8),问如何将M(M<=5)个加号"+"插入到这个数字串中,使所形成的 ...
- SRM 404(1-250pt, 1-500pt)
DIV1 250pt 题意:对于1-9数字三角形如下图,设其为a[i][j],则a[i][j] = (a[i-1][j] + a[i-1][j+1]) % 10.现在对于某个数字三角形, 每行告诉你某 ...
- 【数学】【NOIp2012】同余方程 题解 以及 关于扩展欧几里得与同余方程
什么是GCD? GCD是最大公约数的简称(当然理解为我们伟大的党也未尝不可).在开头,我们先下几个定义: ①a|b表示a能整除b(a是b的约数) ②a mod b表示a-[a/b]b([a/b]在Pa ...
- python 代码格式化工具:pep8ify
资料: https://github.com/spulec/pep8ify 安装 $ pip install pep8ify 用法 Usage: 2to3 [options] file|dir ... ...
- 每一个web开发者都应该了解的HTTP/2
我认为每一个 web 开发者都应该对这个支撑了整个 Web 世界的 HTTP 协议有所了解,这样才能帮助你更好的完成开发任务.在这篇文章中,我将讨论什么是 HTTP,它是怎么产生的,它的地位,以及我们 ...