JS 实现获取验证码 倒计时功能

<style>
button{
  background: #45BCF9;
  color: #fff;
  padding: 4px 10px;
  border: none;
  outline: none;
  cursor: pointer;
}
button:hover{
  background: #00a8fe;
}
button.disabled{
  background: #000;
  cursor: auto;
}
button.disabled:hover{
  background: #000;
}
</style>
<button type=\"button\"  =\"fn()\">获取验证码</button>
< >
function fn(){
  var oBtn = document.getElementsByTagName(\'button\')[0];
  var time = 60;
  var timer = null;
  oBtn.innerHTML = time + \'秒后重新发送\';
  oBtn.setAttribute(\'disabled\', \'disabled\');  // 禁用按钮
  oBtn.setAttribute(\'class\', \'disabled\');   // 添加class 按钮样式变灰
  timer = setInterval(function(){
    // 定时器到底了 兄弟们回家啦
    if(time == 1){
      clearInterval(timer);       
      oBtn.innerHTML = \'获取验证码\';  
      oBtn.removeAttribute(\'disabled\'); 
      oBtn.removeAttribute(\'class\');  
    }else{
      time--;
      oBtn.innerHTML = time + \'秒后重新发送\';
    }
  }, 1000)
}
</ >