亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

簡單實用的js調(diào)試logger組件實現(xiàn)代碼

 更新時間:2010年11月20日 20:27:05   作者:  
開發(fā)js組件的時間調(diào)試總是麻煩的,最常用的就是用alert或者debugger來測試js的運行狀態(tài)。
但這兩種方式都有它的局限性,alert會有中斷,有些時候alert出來的值并不可靠,閉包的時候用alert可能會得到不正確的值。debugger使用起來其實也挺糾結(jié)的,只有ie支持。所以最合理的方式是js把運行過程需要調(diào)試的值輸出到頁面,或者寫到cookie也可以,這種方式不會有alert中斷帶來值不正確的問題,也不會受瀏覽器類型的限制,唯一糾結(jié)的是操作起來很麻煩。
于是,有了下面說的這個js組件。這個組件的實現(xiàn)參考了log4net組件的記錄方式,我們利用這個js的logger組件,就可以用log的輸出的方式來進行你的調(diào)試工作了。
復(fù)制代碼 代碼如下:

/*
js調(diào)試組件
*/
(function () {
var logger = function (level, object, viewType) {
this.level = level;
this.object = object;
this.viewType = viewType;
}
logger.LEVEL_DEBUG = 0;
logger.LEVEL_INFO = 1;
logger.LEVEL_WARN = 2;
logger.LEVEL_ERROR = 3;
logger.LEVEL_FATAL = 4;
logger.VIEW_TYPE_ALERT = 0;
logger.VIEW_TYPE_APPEND = 1;
logger.prototype = {
setLevel: function (level) {
this.level = level;
},
setObject: function (o) {
if (typeof o == 'string') {
this.object = document.getElementById(o);
} else {
this.object = o;
}
},
setViewType: function (type) {
this.viewType = type;
},
log: function (s) {
this.message(100, s);
},
debug: function (s) {
this.message(logger.LEVEL_DEBUG, s);
},
info: function (s) {
this.message(logger.LEVEL_INFO, s);
},
warn: function (s) {
this.message(logger.LEVEL_WARN, s);
},
error: function (s) {
this.message(logger.LEVEL_ERROR, s);
},
fatal: function (s) {
this.message(logger.LEVEL_FATAL, s);
},
message: function (level, s) {
if (level >= this.level) {
if (this.object != null) {
this.object.innerHTML = s;
} else if (this.viewType == logger.VIEW_TYPE_ALERT) {
alert(s);
} else {
document.body.appendChild(document.createTextNode(s));
document.body.appendChild(document.createElement("br"));
}
}
}
};
if (typeof window.Logger == 'undefined' || window.Logger == null)
window.Logger = new logger(logger.LEVEL_DEBUG, null, logger.VIEW_TYPE_APPEND);
})();

怎么使用呢?
這個js組件往window對象注冊了Logger對象,我們可以用Logger.log/Logger.debug/Logger.info/Logger.warn/Logger.error/Logger.fatal來輸出不同的調(diào)試信息。
示例代碼如下:
復(fù)制代碼 代碼如下:

Logger.debug(new Date());
Logger.debug(new Date().addHours(3));

很簡單,再也不用每個地方都寫document.getElementId().innerHtml或者alert/debugger來輸出內(nèi)容了。
示例代碼中使用的addHours是我擴展js的Date對象方法,想要了解更多的朋友可以查看《擴展js的Date方法》。

相關(guān)文章

  • JavaScript中合并數(shù)組的N種方法

    JavaScript中合并數(shù)組的N種方法

    這篇文章主要介紹了JavaScript中合并數(shù)組的N種方法,本文使用concat、循環(huán)插入、reduce等方法合并JavaScript數(shù)組,需要的朋友可以參考下
    2014-09-09
  • JavaScript實現(xiàn)簡易飛機大戰(zhàn)

    JavaScript實現(xiàn)簡易飛機大戰(zhàn)

    這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)簡易飛機大戰(zhàn),文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2022-05-05
  • 微信小程序基于movable-view實現(xiàn)滑動刪除效果

    微信小程序基于movable-view實現(xiàn)滑動刪除效果

    這篇文章主要介紹了微信小程序基于movable-view實現(xiàn)滑動刪除效果,本文通過實例代碼給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下
    2020-01-01
  • javascript 無提示關(guān)閉窗口腳本

    javascript 無提示關(guān)閉窗口腳本

    在IE7、IE8中,使用JavaScript提供的close()方法都可以關(guān)閉當(dāng)前窗口或標(biāo)簽,但都提示討厭的對話框,找了下代碼,終于可以無提示直接關(guān)閉了。
    2009-08-08
  • 原生JS實現(xiàn)簡單的倒計時功能示例

    原生JS實現(xiàn)簡單的倒計時功能示例

    這篇文章主要介紹了原生JS實現(xiàn)簡單的倒計時功能,涉及javascript基于定時器的日期時間運算與頁面元素屬性動態(tài)修改相關(guān)操作技巧,需要的朋友可以參考下
    2018-08-08
  • 簡單談?wù)刯avascript中的變量、作用域和內(nèi)存問題

    簡單談?wù)刯avascript中的變量、作用域和內(nèi)存問題

    這篇文章主要介紹了簡單談?wù)刯avascript中的變量、作用域和內(nèi)存問題的相關(guān)資料,需要的朋友可以參考下
    2015-08-08
  • wavesurfer.js繪制音頻波形圖的實現(xiàn)

    wavesurfer.js繪制音頻波形圖的實現(xiàn)

    這篇文章主要介紹了wavesurfer.js繪制音頻波形圖的實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2021-04-04
  • 微信小程序按鈕點擊跳轉(zhuǎn)頁面詳解

    微信小程序按鈕點擊跳轉(zhuǎn)頁面詳解

    這篇文章主要介紹了微信小程序按鈕點擊跳轉(zhuǎn)頁面,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-05-05
  • JS中實現(xiàn)一個下載進度條及播放進度條的代碼

    JS中實現(xiàn)一個下載進度條及播放進度條的代碼

    這篇文章主要介紹了JS中實現(xiàn)一個下載進度條及播放進度條的代碼,本文圖文并茂給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下
    2019-06-06
  • 微信小程序媒體組件詳解(視頻,音樂,圖片)

    微信小程序媒體組件詳解(視頻,音樂,圖片)

    這篇文章主要為大家詳細介紹了微信小程序媒體組件的相關(guān)資料,包括視頻,音樂,圖片,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-09-09

最新評論