将以下jQuery转换为纯JS

Question

如何将以下注释行转换为纯JS？

var countdown = Tock({
    callback: function () {   

        $('#countdown_clock').val(timer.msToTime(countdown.lap()));  // Convert to pure JS
    }
});

$('#startCountdown').on('click', function () { 

    countdown.start(countdown.timeToMS($('#countdown_clock').val())); // Convert to pure JS 
});     

谢谢！

Answer 1

使用document.getElementById代替jQuery选择器$("#...")

1. document.getElementById('countdown_clock').value = timer.msToTime(countdown.lap();
   

2. countdown.start(countdown.timeToMS(document.getElementById('countdown_clock').value));
   

Answer 2

jQuery $('#selector')与JS document.getElementById('selector')

是一回事

尝试：

var countdown = Tock({
    callback: function () {
       document.getElementById('countdown_clock').value=timer.msToTime(countdown.lap());

    }
});

$('#startCountdown').on('click', function () {
      countdown.start(countdown.timeToMS(document.getElementById('countdown_clock').value));
});

Answer 3

这将删除代码中所有jQuery的痕迹

var countdown = Tock({
    callback: function () {
        //$('#countdown_clock').val(timer.msToTime(countdown.lap())); // Convert to pure JS
         document.getElementById('countdown_clock').value = timer.msToTime(countdown.lap());
    }
});
//$('#startCountdown').on('click', function () {
document.getElementById('startCountdown').onclick = function(e){

    //countdown.start(countdown.timeToMS($('#countdown_clock').val())); // Convert to pure JS
    countdown.start(countdown.timeToMS(getElementById('countdown_clock').value);

}

Answer 4

Pure Js

var clock = document.getElementById('countdown_clock');
var countdown = Tock({
callback: function () {   
    // Convert to pure JS
    clock.value = timer.msToTime(countdown.lap()); 
   }
});

document.getElementById('startCountdown').addEventListener('click', function(){
countdown.start(countdown.timeToMS(clock.value));
}, false);