HTML部分:
- 先用一个大的div标签包住一个小的div标签,然后再在小的div里写三个span标签,最后在span标签里写h1标签,h1标签里写两0。
2、再写一个div标签,用它来包住两个button标签,两个button标签里分别写“开始”和“暂停”。
CSS部分:
JS部分:
- 声明一个全局变量times。然后写一个页面加载事件,在页面加载事件里分别获取两个button按钮。然后为两个button按钮添加点击事件。
- 封装一个方法,函数名称为stemint()。获取当前时间,再分别获取当前的时、分、秒。
三元运算:
3、通过三元运算确保‘时、分、秒’在任何时候都以两位数形式出现。
4、获取HTML中‘时、分、秒’然后将获取到现在的时间添加到HTML上;
5、然后再回到两个button按钮的点击事件中,给‘开始按钮’添加一个计时器setInterval,给‘暂停按钮’添加一个去除定时器clearInterval。最后在页面加载事件中调用方法stemint()。再通过计时器每过一秒调用一次stemint()方法。
最后完成的效果:
初来乍到,请多多指教,大神勿喷。