js 自己创建ready多个可以依次加载
js会把相同的方法名给覆盖了，很多时候我们都无法再页面加载的时候写多个onload事件，这样只有最后一个才能起效，所以从网上找了找，最后决定自己写一个，例子很简单，希望有高人来指导指导
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>javascript_window.ready</title>
</head>
<body>
<script type="text/javascript"> (function(w){
w.readyLength=0;
w.readyFunction=[];
w.ready=function(load){
w.readyFunction[w.readyLength]=load;
w.readyLength++;
}
w.init=function(){
clearInterval(w.readyById);
w.readyFunction.reverse();
while(w.readyFunction.length-1>=0){
w.readyFunction[w.readyFunction.length-1]();
w.readyFunction.pop();
w.readyLength--;
}
}
if('onreadystatechange' in w.document){
w.document.onreadystatechange=onreadystatechange;
}else{
w.readyById = setInterval(onreadystatechange,10);
}
function onreadystatechange(){
console.log(w.document.readyState)
if(w.document.readyState == "complete"){
setTimeout(init,1);
}else if(w.document.addEventListener){
w.document.addEventListener( "DOMContentLoaded", init, false );
w.addEventListener('load',init,false)
}else{
document.attachEvent( "onreadystatechange", init );
w.attachEvent('onload',init)
}
}
}(this));
(function(){
window.ready(function(){
console.log('ready1')
});
window.ready(function(){
console.log('ready2')
}) window.ready(function(){
console.log('ready3')
})
}());;; </script> </body>
</html>
js 自己创建ready多个可以依次加载的更多相关文章
- 学习 easyui 之二：jQuery 的 ready 函数和 easyloader 的加载回调函数
Ready 事件不一定 ready 使用 easyloader 的时候,必须要注意到脚本的加载时机问题,easyloader 会异步加载模块,所以,你使用的模块不一定已经加载了.比如下面的代码. &l ...
- Qt动态连接库/静态连接库创建与使用，QLibrary动态加载库
版权声明:若无来源注明,Techie亮博客文章均为原创. 转载请以链接形式标明本文标题和地址: 本文标题:Qt动态连接库/静态连接库创建与使用,QLibrary动态加载库 本文地址:https ...
- 【Android】纯代码创建页面布局（含异步加载图片）
开发环境:macOS 10.12 + Android Studio 2.2,MinSDK Android 5.1 先看看总体效果 本示例是基于Fragment进行的,直接上代码: [界面结构] 在 F ...
- 创建控制器的方法、控制器加载view过程、控制器view的生命周期、多控制器组合
在介绍四大对象的那篇博客中,可以基本了解到程序启动的过程: main-->UIApplicationMain-->创建UIApplication的实例和app代理AppDelegate的实 ...
- jquery的ready方法（DOM是否加载完）详解与使用
jquery的ready方法(准备DOM触发)还是比较复杂的,我们先看流程图:
- jQuery效果之jQuery实现图片的依次加载图片
css代码: ;;} ul#portfolio li{float: left;margin:0 5px 0 0;width:250px;height: 250px;list-style: none;} ...
- jquery实现图片的依次加载图片
css代码: ul#portfolio{margin:0;padding:0;} ul#portfolio li{float:left;margin:0 5px 0 0;width:250px;hei ...
- Vue.js 开发实践：实现精巧的无限加载与分页功能
本篇文章是一篇Vue.js的教程,目标在于用一种常见的业务场景--分页/无限加载,帮助读者更好的理解Vue.js中的一些设计思想.与许多Todo List类的入门教程相比,更全面的展示使用Vue.js ...
- 原生js移动端touch事件实现上拉加载更多
大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...
随机推荐
- php 数组 添加元素、删除元素
拆分数组 PHP数组添加一个元素的方式: push(), arr[], Php代码 $arr = array(); array_push($arr, el1, el2 ... eln); 但其实有一种 ...
- mysql保存中文乱码的原因和解决办法
当你遇到这个mysql保存中文乱码问题的时候,期待找到mysql保存中文乱码的原因和解决办法这样一篇能解决问题的文章是多么激动人心. 也许30%的程序员会选择自己百度,结果发现网友已经贴了很多类 ...
- Fire逃生
Description: You are trapped in a building consisting of open spaces and walls. Some places are on f ...
- Debian中如何切换默认Python版本
当你安装 Debian Linux 时,安装过程有可能同时为你提供多个可用的 Python 版本,因此系统中会存在多个 Python 的可执行二进制文件,你可以按照以下方法使用 ls 命令来查看你的系 ...
- ANTLR3完全参考指南读书笔记[04]
前言 学习框架或第三方库的方法是什么 (1)少量的浏览manual或tutoral,只关注程序所需的特征,再完善其详细内容和特征的认识? (2)花大量的时间研究详细内容,再考虑程序实现? 这是个先有鸡 ...
- 彻底弄懂css中单位px和em,rem的区别 转的自己看
国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的 ...
- 222. Count Complete Tree Nodes
Given a complete binary tree, count the number of nodes. Definition of a complete binary tree from W ...
- 2016 ACM/ICPC Asia Regional Qingdao Online 1001/HDU5878 打表二分
I Count Two Three Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others ...
- 应用上下文配置【AppConfig】
从spring3.0开始,Spring将JavaConfig整合到核心模块,普通的POJO只需要标注@Configuration注解,就可以成为spring配置类,并通过在方法上标注@Bean注解的方 ...
- Codeforces Round #122 (Div. 2)
A. Exams 枚举分数为3.4.5的数量,然后计算出2的数量即可. B. Square 相当于求\(\min{x(n+1)\ \%\ 4n=0}\) 打表发现,对\(n\ \%\ 4\)分类讨论即 ...