《Javascript高级程序设计》课件——项目五 跳水轮播图——BOM对象.pptxVIP

项目五跳水轮播图——BOM对象;李强是个体育迷，十分喜欢跳水运动，2022年10月23日，德国柏林跳水世界杯女子单人十米台决赛，两名中国选手，上演了神仙打架，陈芋汐，表现优秀，第三轮完成626C动作时，七位裁判中有四位打出了满分10分，全红婵也在这次比赛中贡献了自己精彩的表现，攻克207C的心魔，在第四跳207C上得到不俗的94.05分，最终陈芋汐创造个人职业生涯得分新高，以449.85分夺冠，全红婵收获银牌。两个运动员既是对手，又是搭档，2022.10.21日晚进行的女子双人十米台比赛中，两人以绝对优势，为中国队赢得首金，比美国队高出80多分，陈芋汐，全红婵两名运动员，李强都很钦佩，觉得她们技艺精湛，奋勇拼搏，为国争光，两个人，实力相当，都很优秀，既是搭档，又是对手，李强感慨的不仅是她们的技术实力，赛后的紧紧拥抱，颁奖仪式上对对手的欢呼庆祝，你追我赶，良性竞争，共同进步的竞技氛围，为对手贺彩，友爱，尊重，惺惺相惜的团结精神更让李强感动，李强想用一个网页记录这令人感动的点点滴滴，把这瞬间永存，可是;他只会插入一张图片，如图5-1所示，无法同时呈现这感动的多个瞬间，于是他向王老师请教，怎么一个页面动态展示多个画面，循环播放，王老师说可以用动态轮播图来实现。

;;■掌握BOM的概念以及BOM对象体系的构成

■掌握Window对象的属性和方法

■掌握Screen对象的属性

■掌握Navigator对象的属性

■掌握Location对象的属性和方法

■掌握History对象的属性和方法

■掌握Document对象的属性和方法

;任务一认识BOM;任务一认识BOM;浏览器对象模型（BrowserObjectModel，BOM）主要用于访问和操纵浏览器窗口。BOM主要是由一系列的浏览器对象组成的。这一系列的浏览器对象被称为BOM对象体系如图5-2所示。BOM主要包括Window、Document、History、Location、Navigator、Screen等对象，主要用于操纵浏览器窗口的行为和特征。本任务将详细介绍BOM对象。

;BOM对象的具体功能如表：

;在BOM对象体系中，Window位于顶层，可以使用标识符window直接访问下层对象，如下代码所示。

window.document.write(“hello!”);

因为Window是顶层对象，在平时写代码时，window是可???省略的，如上述代码可以直接写成如下语句。

document.write(“hello!”);

;Window对象用来表示浏览器中一个打开的窗口。Window对象的属性如表所示。

;Window对象的方法如表所示：

;setInterval()方法指按照指定的周期（以ms计）来循环调用函数或计算表达式。

定时器的语法格式如下。

setInterval(code/function,milliseconds);

其中code/function是指要执行一段JavaScript代码或者一个函数；milliseconds是指周期性执行或调用code/function的时间间隔，以ms计。

;执行一段JavaScript代码实现定时的代码如下。

setInterval(“alert(‘hello’)”,2000);

这表示每隔2s弹出“hello”，这里通过代码字符串的方式实现，也可以通过自定义函数的方式实现，具体如下。

functionFunHello(){

alert(hello);

}

setInterval(FunHello,2000);

;通过执行自定义函数的方式来设置定时器时，函数可以带参数，然后将参数输出。定时器在调用带参数的函数时，需要使用JavaScript代码字符串来调用。

functionalertFunc(str){

alert(str);}

setInterval(alertFunc(hello),2000);

如果想要在定时器启动后取消它，我们可以将setInterval()方法的返回值传递给clearInterval()方法，具体如下。

vartimerId=setInterval(FunHello,2000);

clearInterval(timerId);

;延时器setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式。

延时器的语法格式如下。

setTimeout(code/function,milliseconds);

其中code/function是指要执行一段JavaScript代码或者一个函数，m