在jQuery下,等待指定的元素被加载(可以转换为纯js版本)

这个方法声明了使用场合,以免误导你。
例如,在博客花园中,我们不能修改他的源代码。
然后,您只能找到一种方法来监视元素的外观。
因此,下面的方法是在不修改源代码的情况下使用它,而不是编写自己的项目。

今天在博客的几种风格变化中,我认为js的自然添加是可以实现的。
我认为这不是Ajax加载的数据,而不是页面的第一次加载,
例如,下面的注释按钮、正确的搜索按钮等等。
我是自然写的。

复制代码代码如下所示:
1美元(# btn_comment_submit)。RemoveClass(comment_btn)。AddClass(-); / /提交按钮
2美元(。div_my_zzk)。AddClass(输入追加); / /搜索框
3美元(。btn_my_zzk)。RemoveClass(btn_my_zzk)。AddClass(-); / /搜索按钮


但刷新页面后,我们发现有一点错误。看到网络后,我们发现它是ajax。
无奈,除了自己复制的模板外,唯一的办法就是修改代码。

接下来,我想到了等待元素的方式。
虽然它是基于jQuery的,但是代码非常简洁,可以修改成纯js版本。

复制代码代码如下所示:
jquery.fn.wait =函数(函数,次,间隔){
无功_times =次| | - 1 / / 100
_interval =间隔| | 20 / / 20毫秒每次
这_self =,
_selector = this.selector /选择器
_iintervalid; / / ID计时器
如果(此长度){如果您可以访问函数的直接实现
Func func.call(本);
{人}
_iintervalid = setInterval(){()函数(
(如果!_times){ / / 0退出
ClearInterval(_iintervalid);
}
_times 0 | | _times / /:;如果是积极的--

_self = $(_selector); / /再
如果(_self。长度){ / /确定是否采取
Func func.call(_self);
ClearInterval(_iintervalid);
}
},_interval);
}
返回此;
}

该方法的使用也非常简单,只有3个参数。
函数是一个回调函数,它是在指定元素出现时执行的函数。
时间是测试的数量,默认值是- 1,并且一直检测到它出现为止。
间隔是检测间隔,默认为20毫秒一次。

我们修改了以前的代码
复制代码代码如下所示:
$(# btn_comment_submit )(。等待(功能){ / /等待# btn_comment_submit单元加载
This.removeClass(comment_btn)。AddClass(-); / /提交按钮
这里是这 / $(# btn_comment_submit )
});

$(# widget_my_zzk )(。等待(功能){ / /等待# widget_my_zzk单元加载
$(。div_my_zzk)。AddClass(输入追加); / /搜索框
$(。btn_my_zzk)。RemoveClass(btn_my_zzk)。AddClass(-); / /搜索按钮
});

这很简单吗,

当然,还不破坏jQuery的链式结构,你仍然可以$(# ID)。等(函数(){ })(隐藏);
但后来想想,元素都没有加载,继续链是没有意义的,但不是要改变的,是这样的。

在一天结束的时候,我的经验还是很肤浅的,如果它不正确的话,请指出每个人。