08墨林、JavaScript-定時器

每天一句:如果,感到此時的自己很辛苦犯祠,那告訴自己:容易走的都是下坡路旭等!堅持住,因為你正在走上坡路衡载,走過去搔耕,你就一定會有進步。

一痰娱、window.onload使用

網頁中的JS腳本代碼往往需要在文檔加載完成后才能夠執(zhí)行弃榨,否則可能導致無法獲取對象的情況,為了避免這種情況發(fā)生梨睁,可以使用以下兩種方式:

  • 將腳本代碼放在網頁的底部鲸睛,即可保證運行腳本代碼時,要操作的對象已經加載完成(該方式比較凌亂坡贺,但推薦使用);
  • 通過window.onload來執(zhí)行腳本代碼;(window.onload是一個事件腊凶,當文檔加載完成之后就會觸發(fā)該事件,即可以將要執(zhí)行的腳本代碼放在事件處理函數中);

注: window.onload只會執(zhí)行一次;

二拴念、獲取元素樣式

  • getComputeStyle() 非IE瀏覽器
  參數1: 需要獲取樣式的元素對象;
  參數2: 偽元素钧萍,例如 :hover, :first-letter, :before等,如果不需要偽元素則該參數為null或忽略不寫;
  返回值: 對應元素的樣式

  // 獲取按鈕寬度
  var style = getComputedStyle(oBt);
  alert(style.width);
  • currentStyle() IE瀏覽器
  // 獲取按鈕寬度
  alert( oBt.currentStyle.width );
  • 兼容寫法
  // 為了兼容的寫法
  if(window.getComputedStyle){  
    width = getComputedStyle(oBt).width;
  } else {
    width = oBt.currentStyle.width;
  }

備注: style屬性只能獲取內聯樣式政鼠,獲取不到外部樣式和內部樣式;

案例: 函數封裝 — $符號的操作 (有助于之后學習jQuery)
案例: 函數封裝 — 獲取元素對應的屬性

三风瘦、定時器/時鐘

  • 定時器的開啟
  語法:
    setInterval(函數, 毫秒);
  說明:
    參數1: 函數名即可(不要括號,如果有帶括號是函數調用);;
    參數2: 1000毫秒 = 1秒公般,另外最小是為10毫秒;
    返回值: 定時器對象;

  timer = setInterval(function(){
    console.log('hello');
  }, 2000);
  • 定時器的關閉
// 并不表示時鐘對象為null
clearInterval(定時器名);
 備注: 
  setInterval()和clearInterval()万搔,定時器是重復執(zhí)行的;
  setTimeout()和clearTimeout()胡桨,定時器只執(zhí)行一次;

案例: 輪播圖
案例: 湯姆貓
案例: 彈窗廣告

四、Date類型

Date類型使用UTC(國際協調時間又稱世界統(tǒng)一時間1970年1月1日午夜(零時)開始經過的毫秒來保存日期

  • 獲取本地時間
  var nowTime = new Date();
  • 獲取當前時間距離1970年1月1日之間的毫秒數
  var nowTime = new Date();
  alert(nowTime.getTime);
  • 獲取年份(4位數)
  var year = nowTime.getFullYear();
  • 獲取月份(0-11)
  var month = nowTime.getMonth();
  • 獲取日期
  var date = nowTime.getDate();
  • 獲取星期(0-6)
  var day = nowTime.getDay();
  • 獲取時
  var hour = nowTime.getHours();
  • 獲取分
  var min = nowTime.getMinutes();
  • 獲取秒
  var sec = nowTime.getSeconds();
  • 設置時間
  var timer = new Date();
  timer.setDate(6); // 設置日期
  timer.setHours(12);// 設置小時
  timer.setMinutes(10);// 設置分鐘
  timer.setSeconds(50);// 設置秒

案例: 將當前日期格式化輸出為'2017年01月06日 星期五 16:33:30'瞬雹,并時間會走動
案例: 倒計時效果

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末昧谊,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子酗捌,更是在濱河造成了極大的恐慌呢诬,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,084評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件胖缤,死亡現場離奇詭異尚镰,居然都是意外死亡,警方通過查閱死者的電腦和手機哪廓,發(fā)現死者居然都...
    沈念sama閱讀 92,623評論 3 392
  • 文/潘曉璐 我一進店門狗唉,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人涡真,你說我怎么就攤上這事分俯。” “怎么了哆料?”我有些...
    開封第一講書人閱讀 163,450評論 0 353
  • 文/不壞的土叔 我叫張陵缸剪,是天一觀的道長。 經常有香客問我剧劝,道長橄登,這世上最難降的妖魔是什么抓歼? 我笑而不...
    開封第一講書人閱讀 58,322評論 1 293
  • 正文 為了忘掉前任讥此,我火速辦了婚禮,結果婚禮上谣妻,老公的妹妹穿的比我還像新娘萄喳。我一直安慰自己,他們只是感情好蹋半,可當我...
    茶點故事閱讀 67,370評論 6 390
  • 文/花漫 我一把揭開白布他巨。 她就那樣靜靜地躺著,像睡著了一般减江。 火紅的嫁衣襯著肌膚如雪染突。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,274評論 1 300
  • 那天辈灼,我揣著相機與錄音份企,去河邊找鬼。 笑死巡莹,一個胖子當著我的面吹牛司志,可吹牛的內容都是我干的甜紫。 我是一名探鬼主播,決...
    沈念sama閱讀 40,126評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼骂远,長吁一口氣:“原來是場噩夢啊……” “哼囚霸!你這毒婦竟也來了?” 一聲冷哼從身側響起激才,我...
    開封第一講書人閱讀 38,980評論 0 275
  • 序言:老撾萬榮一對情侶失蹤拓型,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后贸营,有當地人在樹林里發(fā)現了一具尸體吨述,經...
    沈念sama閱讀 45,414評論 1 313
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,599評論 3 334
  • 正文 我和宋清朗相戀三年钞脂,在試婚紗的時候發(fā)現自己被綠了揣云。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,773評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡冰啃,死狀恐怖邓夕,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情阎毅,我是刑警寧澤焚刚,帶...
    沈念sama閱讀 35,470評論 5 344
  • 正文 年R本政府宣布,位于F島的核電站扇调,受9級特大地震影響矿咕,放射性物質發(fā)生泄漏。R本人自食惡果不足惜狼钮,卻給世界環(huán)境...
    茶點故事閱讀 41,080評論 3 327
  • 文/蒙蒙 一碳柱、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧熬芜,春花似錦莲镣、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,713評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至鼓拧,卻和暖如春半火,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背季俩。 一陣腳步聲響...
    開封第一講書人閱讀 32,852評論 1 269
  • 我被黑心中介騙來泰國打工钮糖, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人种玛。 一個月前我還...
    沈念sama閱讀 47,865評論 2 370
  • 正文 我出身青樓藐鹤,卻偏偏與公主長得像瓤檐,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子娱节,可洞房花燭夜當晚...
    茶點故事閱讀 44,689評論 2 354

推薦閱讀更多精彩內容

  • JavaScript 將字符串轉換為數字 parseInt() ◆只保留數字的整數部分挠蛉,不會進行四舍五入運算。 ...
    AkaTBS閱讀 985評論 0 9
  • 獲取元素:document.getElementById 通過id獲取一個元素obj.getEle...
    蒲公英_前端開發(fā)者閱讀 618評論 0 4
  • 一肄满、JS前言 (1)認識JS 也許你已經了解HTML標記(也稱為結構)谴古,知道了CSS樣式(也稱為表示),會使用HT...
    凜0_0閱讀 2,770評論 0 8
  • 溫故而知新稠歉,可以為師矣掰担。 集中式代碼管理工具 SVN:管理代碼 服務端存代碼的 客戶端 1 上傳代碼 ...
    Cyril丶閱讀 465評論 0 0
  • 文/我是你眼中的蘋果 “扛不住時間的力量,沒人能逃過怒炸,它橫掃的鐮刀” 昨兒貓哥在群里呼叫带饱,讓晚上聚聚。群里頓時炸開...
    我是你眼中的蘋果閱讀 11,511評論 14 52