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. MYSQL的硬盘IO过高引起的CPU过高判断

    其实,为客户提供相关日志,不就是RACKSPACE主要作的事? 俺们以后也可以效仿的.不要去解决,而是协助客户定位. http://blog.const.net.cn/a/17275.htm 上文的思 ...

  2. 【HDOJ】1484 Basic wall maze

    BFS. /* 1484 */ #include <iostream> #include <queue> #include <string> #include &l ...

  3. Unity NGUI Tween的用法

    unity版本:4.5 NGUI版本:3.6.5 参考链接:http://www.colabug.com/thread-1029974-1-1.html,作者:COLABUG.COM 橘虞   htt ...

  4. 「Poetize5」水叮当的舞步

    Description 水叮当得到了一块五颜六色的格子形地毯作为生日礼物,更加特别的是,地毯上格子的颜色还能随着踩踏而改变. 为了讨好她的偶像虹猫,水叮当决定在地毯上跳一支轻盈的舞来卖萌~~~ 地毯上 ...

  5. 【转】Android:Layout_weight的深刻理解

    原文网址:http://mobile.51cto.com/abased-375428.htm 本文详细介绍了Android布局中Layout_weight的属性,它是用来分配属于空间的一个属性,你可以 ...

  6. 奔跑的xiaodao

    http://acm.hrbust.edu.cn/index.php?m=ProblemSet&a=showProblem&problem_id=2086 很明显的一个二分题目.因为要 ...

  7. Android从网络下载文件

    1.主Activity public class MainActivity extends Activity { private Button download=null; private EditT ...

  8. 例6.1:学生选课系统设计(界面设计、类图、数据库ER图)

  9. SRM 398(1-250pt)

    题意:有两个变量x和y,三种运算符+,*,-,组成等式"变量 运算符 变量 运算符 变量 运算符 变量",要求每个变量恰好出现两次,且等式的值为val的等式有多少个.注意不计算运算 ...

  10. loadView是干什么用的

    文/natewang(简书作者)原文链接:http://www.jianshu.com/p/f8d261d49615著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. viewContro ...