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 ...
随机推荐
- MYSQL的硬盘IO过高引起的CPU过高判断
其实,为客户提供相关日志,不就是RACKSPACE主要作的事? 俺们以后也可以效仿的.不要去解决,而是协助客户定位. http://blog.const.net.cn/a/17275.htm 上文的思 ...
- 【HDOJ】1484 Basic wall maze
BFS. /* 1484 */ #include <iostream> #include <queue> #include <string> #include &l ...
- Unity NGUI Tween的用法
unity版本:4.5 NGUI版本:3.6.5 参考链接:http://www.colabug.com/thread-1029974-1-1.html,作者:COLABUG.COM 橘虞 htt ...
- 「Poetize5」水叮当的舞步
Description 水叮当得到了一块五颜六色的格子形地毯作为生日礼物,更加特别的是,地毯上格子的颜色还能随着踩踏而改变. 为了讨好她的偶像虹猫,水叮当决定在地毯上跳一支轻盈的舞来卖萌~~~ 地毯上 ...
- 【转】Android:Layout_weight的深刻理解
原文网址:http://mobile.51cto.com/abased-375428.htm 本文详细介绍了Android布局中Layout_weight的属性,它是用来分配属于空间的一个属性,你可以 ...
- 奔跑的xiaodao
http://acm.hrbust.edu.cn/index.php?m=ProblemSet&a=showProblem&problem_id=2086 很明显的一个二分题目.因为要 ...
- Android从网络下载文件
1.主Activity public class MainActivity extends Activity { private Button download=null; private EditT ...
- 例6.1:学生选课系统设计(界面设计、类图、数据库ER图)
- SRM 398(1-250pt)
题意:有两个变量x和y,三种运算符+,*,-,组成等式"变量 运算符 变量 运算符 变量 运算符 变量",要求每个变量恰好出现两次,且等式的值为val的等式有多少个.注意不计算运算 ...
- loadView是干什么用的
文/natewang(简书作者)原文链接:http://www.jianshu.com/p/f8d261d49615著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. viewContro ...