jQuery下實現等待指定元素加載完畢

先聲明下這個方法的使用場合，以免誤導大家。。
比如在博客園，我們沒法修改他的源代碼，
那么只能想辦法監視元素的出現了。
所以下面方法是在修改不了源碼的情況下使用，而非寫自己的項目。。

今天在改博客幾個樣式的時候，以為很自然的加上js就可以實現了，
沒想到那個是ajax加載的數據，而非頁面首次加載的，
比如下面的 “提交評論” 按鈕，右側的 搜索按鈕 等。
我很自然的寫了

$("#btn_comment_submit").removeClass("comment_btn").addClass("btn"); //提交按鈕
$(".div_my_zzk").addClass("input-append"); //搜索框
$(".btn_my_zzk").removeClass("btn_my_zzk").addClass("btn"); //搜索按鈕

可是刷新頁面后發現有點不對，看了 network 后發現是 ajax 過來的，
無奈，除了自己寫模版之外，只能自己想辦法修改代碼了。

那么下面就是我想到的等待元素出現方法。
雖然是基於 jQuery 的，但是代碼很簡潔，可以修改成純js版的。

jQuery.fn.wait = function (func, times, interval) {
    var _times = times || -1, //100次
    _interval = interval || 20, //20毫秒每次 
    _self = this,
    _selector = this.selector, //選擇器
    _iIntervalID; //定時器id
    if( this.length ){ //如果已經獲取到了，就直接執行函數
        func && func.call(this);
    } else {
        _iIntervalID = setInterval(function() {
            if(!_times) { //是0就退出
                clearInterval(_iIntervalID);
            }
            _times <= 0 || _times--; //如果是正數就 --
            
            _self = $(_selector); //再次選擇
            if( _self.length ) { //判斷是否取到
                func && func.call(_self);
                clearInterval(_iIntervalID);
            }
        }, _interval);
    }
    return this;
}

使用方法當然也很簡單，只有3個參數。
func 是回調函數，就是當指定元素出現后就執行的函數。
times 是檢測次數，默認是-1，一直檢測直到出現為止。
interval 是檢測間隔，默認 20 毫秒一次。

我們修改下之前的代碼

$("#btn_comment_submit").wait(function() { //等待#btn_comment_submit元素的加載
    this.removeClass("comment_btn").addClass("btn"); //提交按鈕
    //這里的 this 就是 $("#btn_comment_submit")
});

$("#widget_my_zzk").wait(function() { //等待#widget_my_zzk元素的加載
    $(".div_my_zzk").addClass("input-append"); //搜索框
    $(".btn_my_zzk").removeClass("btn_my_zzk").addClass("btn"); //搜索按鈕
});

是不是很簡單、、

當然，依然不破壞jQuery的鏈式結構，你依然可以 $("#id").wait(function(){}).hide();
但是后來想想，元素都沒加載，繼續鏈下去也沒意義，不過算了，不改了，就這樣吧。呵呵 :-)

最后說點，，我經驗尚淺，如果那里寫的不對，還請各位大俠指點。