BOM是Browser Object Model的缩写,即浏览器对象模型,提供了独立于网页内容和浏览器窗体之间进行交互的APi。API由若干对象组成,因为浏览器是Javascript的宿主,因此,这些对象也称为宿主对象。

一、定时器--间隔调用和延迟调用

1、setInterval()和clearInterval()方法实现间隔调用(循坏调用)

setInterval(code,millisec[,"lang"]):依照指定的周期(以毫秒计)来调用函数或计算表达式,直到 clearInterval() 被调用或窗体被关闭。返回一个能够传递给 Window.clearInterval() 从而取消对 code 的周期性运行的值。

code:必须,要调用的函数或要运行的代码串。

调用函数传入函数名或者创建匿名函数。

millisec:必须,间隔调用的时间。以毫秒为单位。

lang:可选。用于定义传递给函数的随意数量的參数。

若要用clearInterval()方法取消setInterval()方法调用,就必须将setInterval的返回值赋给一个变量给clearInterval调用。

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<style type="text/css">
#div1
{
width: 150px;
height: 125px;
border: 1px dashed #ccc;
}
</style>
</head>
<body>
<div id="div1"> </div>
<button onclick="javascript:clearInterval(cancel)">
Stop interval</button>
<script type="text/javascript">
var iCount = 0;
var text = "setInterval()函数正在执行...";
var divText = "";
var oDiv = document.getElementById("div1"); function print () {
divText += text[iCount];
oDiv.innerHTML = divText;
iCount++;
}
var cancel = setInterval(print,1000);
</script>
</body>
</html>

结果:

2、setTimeout()和clearTimeout()方法实现延迟调用

setTimeout(code,millisec):用于在指定的毫秒数后调用函数或计算表达式,仅仅运行 code 一次,不循环调用,假设要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。參数同setInterval。

若要用clearTimeout()方法取消clearTimeout()方法调用。就必须将setTimeout()的返回值赋给一个变量给clearTimeout()调用。

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<style type="text/css">
#div1
{
width: 150px;
height: 125px;
border: 1px dashed #ccc;
}
</style>
</head>
<body>
<div id="div1">
2秒钟后出现其它内容
</div>
<button onclick="javascript:clearInterval(cancel)">
Stop interval</button>
<script type="text/javascript">
var text = "setTimeout()函数正在执行..."; var oDiv = document.getElementById("div1"); function print () {
oDiv.innerHTML = text;
}
var cancel = setTimeout(print,2000);
</script>
</body>
</html>

结果:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMTA0Mzg0Mw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">

3、强制清除:没有一个内建的方法能够一次清除全部的setInterval()或者setTimeout(),因此要採用循环清除:

for(var i = 0; i < 10; i++) clearTimeout(i);

二、主要的交互操作

1、alert(msg):警告对话框,msg是要显示的文本字符串。包括的HTML原样显示。

2、confirm(msg):确认对话框,參数同alert;方法返回TRUE(“确定”)或者FALSE(“取消)。

3、prompt(msg[,input]):提示输入消息对话框,msg同alert,input可选。定义在文本框中显示的信息,不定义input,则为空。prompt()方法以字符串或者整数返回用户输入的信息。按取消button返回null

4、showModalDialog(URL[,arg]);打开一个新窗体类型的对话框,能够载入一个网页(可是不能刷新)。URL是载入网页的URL地址,arg是传递给窗体的參数。部分浏览器默认阻止弹出这个窗体,须要设置同意弹出新窗体。该方法有返回值。

5、print():打印当前文档。

var returned = confirm("你是SB吗?");
if(returned)
{
    document.write("你是SB<br/>");
}
else
{
    document.write("你不是SB<br/>");
} var value = prompt("你多少岁?",100); document.write("你是"+value+"岁<br/>"); showModalDialog("http://blog.csdn.net/u011043843");

三、窗体交互操作

1、window.open():打开一个新的浏览器窗体或查找一个已命名的窗体。返回新窗体的引用。

features的可选值:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMTA0Mzg0Mw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">

<html>
<head>
<script type="text/javascript">
function open_win()
{
window.open("http://www.w3school.com.cn")
}
</script>
</head>
<body> <input type=button value="Open Window" onclick="open_win()" /> </body>
</html>

2、window.close([arg]):关闭窗体,arg是窗体的引用,没有定义arg,则关闭当前窗体。

3、window.stop():取消文档的载入。

4、获取窗体引用:window[index] 或 window[name]:依据索引或者名称获取window对象,属性例如以下:

5、window.blur()和window.focus():分别使窗体失去焦点和获取焦点,并触发onblur和onfocus事件。

四、HTML5 中新增的几个属性

1、window.locationbar.visible:是一个布尔值,定义地址栏是否可见

2、window.menubar.visible:是一个布尔值,定义菜单条是否可见

3、window.personalbar.visible:是一个布尔值。定义个人栏是否可见

4、window.scrollbars.visible:是一个布尔值,定义滚动条是否可见

5、window.statusbar.visible:是一个布尔值。定义状态栏是否可见

6、window.toolbar.visible:是一个布尔值,定义工具栏是否可见

《Javascript权威指南》学习笔记之十五:BOM之源---window对象的更多相关文章

  1. JavaScript 权威指南-学习笔记(一)

    本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! ## JavaScript 权威指南-学 ...

  2. JavaScript权威指南学习笔记6

    这两天主要翻看了书中的第18-22章,重点看了第17章:事件化处理,其它几章节主要是翻了下书知道有相关的概念,没有真正理解其中的内容,或者没有考虑究竟如何能把里面的内容应用到实际的项目中.说的讽刺一点 ...

  3. JavaScript权威指南学习笔记5

    下午在杭图回去前看了书中第二部分的13-17章,看的很粗,感觉大部分东西自己已经知道或者平时开发中不会用到,很多章节只是简单的翻了一下,没有仔细思考里面说到的道理,下面对各章节简单的记录下. 第13章 ...

  4. Javascript权威指南学习笔记

    第二章:词法结构 ;function a(){alert(2)};//前面的分号保证正确地语句解析 第三章:类型.值和变量 基本概念: 1.数据类型---能够表示并操作的值的类型叫做数据类型. 2.变 ...

  5. javascript权威指南学习笔记1

    打开这本书,进入到javascript的世界.以前都是看各种视频,感觉什么收获也没有,反而弄得脑袋混乱,希望能够按照这本书的节奏掌握javascript这门语言,为我的前端学习打下基础. 学习前准备: ...

  6. JavaScript权威指南学习笔记4

    今天看了第9.10.11章,感觉收获最大还是正则表达式那章节,不过这些不用太多脑子思考,问题用到了直接查书就可以了,下面分别总结一下: 第9章类和模块:分9节,前面8节都是在讲类相关的知识,最后一节讲 ...

  7. javascript权威指南学习笔记3

    今天看到第四章,记录一下其中的几个点,俗话说:好记性不如烂笔头嘛. 4.9   in运算符和instanceof运算符 in运算符希望它的左操作数是一个字符串或可以转化为字符串,希望它的右操作数是一个 ...

  8. javascript权威指南学习笔记2

    Javascript语言核心(2~12章) 第三章:类型.值.变量 1.数字: overflow(Infinity, -Infinity).underflow(+0,-0) 非数字值:它和任何值都不相 ...

  9. 《HTTP 权威指南》笔记:第十五章 实体与编码

     如果把 「HTTP 报文」想象为因特网货运系统的「箱子」,那么「HTTP 实体」就是报文中的实际的「货物」. 其中,实体又包含了「实体首部」 和 「实体主体」,实体首部用于描述各种参数,实体主体就 ...

  10. JavaScript高级程序设计学习笔记第十五章--使用Canvas绘图

    一.基本用法 1.要使用<canvas>元素,必须先设置其 width 和 height 属性,指定可以绘图的区域大小.能通过 CSS 为该元素添加样式,如果不添加任何样式或者不绘制任何图 ...

随机推荐

  1. ios weak和strong的差别

    The difference is that an object will be deallocated as soon as there are no strong pointers to it. ...

  2. CodeForces 131C C (组合)

    There are n boys and m girls attending a theatre club. To set a play "The Big Bang Theory" ...

  3. php百度翻译类

    <?php // +---------------------------------------------------------------------- // | PHP MVC Fra ...

  4. BPM不同表单之间子表的赋值

    上次写的是同一个表单的子表之间赋值,这次是不同表单之间子表的赋值 首先,我们给需要赋值的表单添加一个复制按钮 $.MvcSheet.AddAction({            Action: &qu ...

  5. vue开发的项目中遇到的警告,报错,配置项目文件等合集(长期更新)

    1. Vue组件里面data()里面没有return时触发错误:Vue components Cannot read property '__ob__' of undefined 这个警告不解决会触发 ...

  6. 测试数据准备中用到到csv写文件知识点

    对于大数据测试中,有时需要自己去准备一些数据,用csvreader来写一个比较大的文件就比较方便,下面我就直接贴示例代码了: package com.acxm.amysu.test;import co ...

  7. Android之Action Bar

    Action Bar在实际应用中,很好地为用户提供了导航,窗口位置标识,操作点击等功能.它出现于Android3.0(API 11)之后的版本中,在2.1之后的版本中也可以使用. 添加与隐藏Actio ...

  8. TensorFlow-LSTM序列预测

    问题情境:已知某一天内到目前为止股票各个时刻的价格,预测接下来短时间内的价格变化. import tushare as ts import time from collections import n ...

  9. 修复wordpress插件编辑器漏洞

    具体方法,将下面的代码添加到您的配置文件 wp-config.php中: define( 'DISALLOW_FILE_EDIT', true ); 以此关闭插件编辑器功能,一切就这么简单,漏洞也就不 ...

  10. JavaScript获取非行间样式

    <html> <head> <meta charset="utf-8"> <title>无标题文档</title> &l ...