《JavaScript动态网页设计》课件 5 制作浮动广告.pptx

项目5制作浮动广告主讲：***2024年12月18日JavaScript动态网页设计1子项目

2024年12月18日JavaScript动态网页设计2学习任务 任务1JavaScript对象任务2浏览器对象模型（BOM）任务3制作浮动广告

2024年12月18日JavaScript动态网页设计3任务1JavaScript对象JavaScript是一门基于对象的编程语言。在JavaScript中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，例如字符串、数值、数组、函数等。对象是一种复杂数据类型，由属性和方法组成，其中，属性是指对象的特征，方法是指对象的行为。在JavaScript中，属性是以变量的形式存在，使用“对象.属性名”进行访问；方法是对象中的函数，使用“对象.方法名()”进行访问。

2024年12月18日JavaScript动态网页设计4一、内置对象内置对象是由JavaScript自带的一系列对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能（属性和方法）。内置对象是编写自定义代码的基础，JavaScript提供了很多内置对象，有Math、Date、String、Array等，其基本功能如表5-1所示。?表5-1?JavaScript内置对象的基本功能?

2024年12月18日JavaScript动态网页设计51、Date对象（日期时间对象）Date对象用于处理日期和时间，在开发中，获取系统当前日期和时间、计算时间差等，可以通过Date对象来完成。Date对象是一个构造函数，所以需要实例化后才能使用。（1）创建Date对象a)?创建系统当前时间的Date对象。vartoday=newDate();??????//表示此时此刻b)?创建指定日期的Date对象。newDate(dateString);其中，dateString的格式可以是“yyyy-mm-dd”、“yyyy/mm/dd”、“yyyy,mm,dd”。vartime1=newDate(2024-4-1);vartime2=newDate(2024/4/2);vartime3=newDate(2024,4,3);

2024年12月18日JavaScript动态网页设计6c)?创建一个指定日期和时间的Date对象。newDate(“2024,4,1,10:20:40:50”);?//表示2024年4月1日10点30分40秒50毫秒其中，参数分别表示年、月、日、时、分、秒和毫秒。vartime=newDate(year,month,day,hours,minutes,seconds,milliseconds);d)?创建一个通过毫秒数转变的Date对象newDate(milliseconds);表示从‘1970/01/0100:00:00’到所返回的date对象两者之间相隔的毫秒数。

2024年12月18日JavaScript动态网页设计7（2）Date对象的使用获取日期对象后，直接输出对象得到的是一个字符串表示的日期和时间。如果想要日期对象其他格式的日期和时间，比如年、月、日、时、分、秒等。日期对象常用方法如表5-2所示。

2024年12月18日JavaScript动态网页设计8【范例5-1】Date对象的使用，获取当前时间，在控制台输出。varti=newDate();??????????????????????//获取当前日期和时间vary=ti.getFullYear();???????????????//获取年varm=ti.getMonth();??????????????????//获取月vard=ti.getDate();???????????????????//获取日console.log(‘今天是’+y+‘年’+m+‘月’+d+‘日’);?在Chrome浏览器中的运行结果如图5-1所示。?图5-1??运行结果

2024年12月18日JavaScript动态网页设计92、String对象（字符串对象）在JavaScript中，对于字符串的查找、截取、替换等处理操作，字符串对象提供了一些属性和方法。（1）创建String对象a）?使用newString()构造函数varstr1=newString(‘javascript’);b）?使用单引号或双引号括起来varstr2=‘hello’;varstr3=“你好”;（2）String对象的属性String对象最常用的属性就是length属性，用来返回字符串的长度。如下。varstr=‘hellohe