JavaScript可以開始和停止的倒計時

2021-08-15 14:13:26 字數 1237 閱讀 7926

**如下:

01分鐘40秒

上面的**實現了我們的要求,下面介紹一下它的實現過程。

一.**注釋:

(1).window.οnlοad=function (){},當文件內容完全載入完畢再去執行函式中的**。

(2).var ocountdown=document.getelementbyid("countdown"),獲取id屬性值為countdown的元素物件。

(3).var ainput=ocountdown.getelementsbytagname("input")[0],獲取第乙個input元素,也就是按鈕元素。

(4).var timer=null,用來作為定時器方法的標識。

(5).ainput.οnclick=function(){},為按鈕註冊click事件處理函式。

(6).this.value=="開始倒計時"?(timer=setinterval(updatetime,1000),this.value="結束倒計時") : (clearinterval(timer),this.value="開始倒計時"),使用三元運算子來設定按鈕的value屬性值,和開始和停止倒計時效果。

(7).function format(a),格式化數字,如果是個位數字,前面加0.

(8).function updatetime (){},此函式是實現倒計時效果的核心。

(9).var aspan=ocountdown.getelementsbytagname("span"),獲取span元素集合。

(10).var oremain=aspan[0].innerhtml.replace(/^0/,'') * 60+parseint(aspan[1].innerhtml.replace(/^0/,'')),使用正規表示式將開始的零刪除,並計算出所有時間的秒數。

(11).if(oremain<=0),如果剩餘的秒數小於等於零,自然要停止倒計時效果了,並跳出函式。

(12).oremain--,秒數減一。

(13).aspan[0].innerhtml=format(parseint(oremain / 60)),計算並顯示分鐘數。

(14).oremain %= 60,進行求餘運算,算出秒數。

(15).aspan[1].innerhtml=format(parseint(oremain)),顯示秒數。

效果如下:

可以開始了

上週,各方面的訊息都告訴我,畢業設計進度已經嚴重滯後。非常感謝這些及時的訊息,讓我認清了當前的形勢,並且經過了一周的努力,我終於找到了開始前行的方向。1,研究802.16mode在ns2中的實現,順便可以了解wimax的一些機制。2,研究802.21的mih模組在ns2中的實現。了解其中的異構網路模...

從零開始學習javascript(一)

從基礎開始吧,加油 表示和處理乙個html或xml文件的常用方法,可以歸類為介面,其實從個人看來也就是個定義格式的標準?層層巢狀的節點樹 由此衍生的各類呼叫方法。dom也是有分類噠,比如xml dom 用於獲取 更改 新增或刪除 xml 元素的標準 和html dom 關於如何獲取 修改 新增或刪除...

從零開始積累的javascript陣列面試題

相關部落格 陣列扁平化 方式一 param arr 陣列 function flat1 arr 陣列扁平化 方式二 param arr 陣列 function flat2 arr 陣列去重複 param arr 陣列 function unique arr var obj console.log a...