点击按钮在页面显示当前时间

简易的HTML部分

Js部分首先设置一个全局变量 timer赋值为true（命名根据自己需求而定）,然后获取开始按钮和暂停按钮。如下图

接着给开始按钮绑定点击事件，然后在点击事件里面用if方法进行一次判断，判断timer的值是否为true，如果判断成功则继续下一步，然后重新赋值timer的值为false

   把timer的值改变后，设置一个定时计时器，并设置100毫秒调用一次

然后在计时器里面的回调函数里获取到需要插入的HTML元素，之后获取当前时间，并将当前的时间一个个的转接成年、月、日、时、分、秒。如下图

之后我们对转换后的数值进行补零操作，意思是如果转换后的值没有两位数也就是小于10就要在那个数值的前面加个0达到形成两位数的效果。这样子后面拼接下来也就好看很多，拼接的方法也很简单使用三目运算就行了。如下图

将拼接好的数值进行最后的拼接并插入到之前获取到的HTML元素里面

最后在开始按钮的点击事件外面也给结束的按钮绑定单击事件，那么在点击结束按钮时清除开始按钮里面的定时计时器，然后把timer的值重新赋值为true。如下图

这里说一下一开始定一个全局变量的原因，如果多次点击开始按钮，那么结束按钮就会卡死不会暂停时间，所以我们在前面加一个判断如果全局变量为false的时候就说明开始按钮已经被点击了，需要点击结束按钮把全局变量改为true时才可以再次点击开始按钮。