第8章 BOM-补充案例.docVIP

第8章 JavaScript编程基础 PAGE 2 PAGE 5 第8章补充案例 【案例8-1】 限时秒杀 一、案例描述 考核知识点 定时器setInterval()方法、Date()和时间格式转换。 练习目标 掌握setInterval()的用法 掌握Date()的用法 掌握时间格式的转换方式 需求分析 电子商务网站中，商家为了促销经常会策划一些活动，增加消费者购买商品的紧张感。其中，限时秒杀就是最常见的一种手段。功能实现的过程主要包括两部分组成，第一部分是设计限时秒杀页面，如页面结构、页面样式，第二部分是编写JavaScript代码，实现页面的限时秒杀功能。 案例分析 效果如图8-1、8-2所示。 初始页面效果 限时秒杀效果 具体实现步骤如下： 设计限时秒杀页面 实现限时秒杀功能 二、案例实现 根据上面的分析，编写代码来实现8-1页面效果，具体代码如下。 div class=box div id=d/div !-- 剩余的天数 -- div id=h/div !-- 剩余的小时 -- div id=m/div !-- 剩余的分钟 -- div id=s/div !-- 剩余的秒数 -- /div 保存后，在谷歌浏览器中预览，效果如图8-1所示。 通过JavaScript代码来实现8-2效果，具体代码如下。 // 设置秒杀结束时间 var