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多个可以依次加载的更多相关文章

  1. 学习 easyui 之二:jQuery 的 ready 函数和 easyloader 的加载回调函数

    Ready 事件不一定 ready 使用 easyloader 的时候,必须要注意到脚本的加载时机问题,easyloader 会异步加载模块,所以,你使用的模块不一定已经加载了.比如下面的代码. &l ...

  2. Qt动态连接库/静态连接库创建与使用,QLibrary动态加载库

    版权声明:若无来源注明,Techie亮博客文章均为原创. 转载请以链接形式标明本文标题和地址: 本文标题:Qt动态连接库/静态连接库创建与使用,QLibrary动态加载库     本文地址:https ...

  3. 【Android】纯代码创建页面布局(含异步加载图片)

    开发环境:macOS 10.12 + Android Studio 2.2,MinSDK Android 5.1 先看看总体效果 本示例是基于Fragment进行的,直接上代码: [界面结构] 在 F ...

  4. 创建控制器的方法、控制器加载view过程、控制器view的生命周期、多控制器组合

    在介绍四大对象的那篇博客中,可以基本了解到程序启动的过程: main-->UIApplicationMain-->创建UIApplication的实例和app代理AppDelegate的实 ...

  5. jquery的ready方法(DOM是否加载完)详解与使用

    jquery的ready方法(准备DOM触发)还是比较复杂的,我们先看流程图:

  6. jQuery效果之jQuery实现图片的依次加载图片

    css代码: ;;} ul#portfolio li{float: left;margin:0 5px 0 0;width:250px;height: 250px;list-style: none;} ...

  7. jquery实现图片的依次加载图片

    css代码: ul#portfolio{margin:0;padding:0;} ul#portfolio li{float:left;margin:0 5px 0 0;width:250px;hei ...

  8. Vue.js 开发实践:实现精巧的无限加载与分页功能

    本篇文章是一篇Vue.js的教程,目标在于用一种常见的业务场景--分页/无限加载,帮助读者更好的理解Vue.js中的一些设计思想.与许多Todo List类的入门教程相比,更全面的展示使用Vue.js ...

  9. 原生js移动端touch事件实现上拉加载更多

    大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...

随机推荐

  1. C#静态类和静态成员

    1. 静态类 1.1 简介  静态类和类成员用于创建无需创建类的实例就能够访问的数据和函数. 静态类成员可用于分离独立于任何对象标识的数据和行为:无论对象发生什么更改,这些数据和函数都不会随之变化. ...

  2. apache2将http自动指向https

    <VirtualHost *:80> RewriteEngine On RewriteCond %{HTTPS} off RewriteRule (.*) https://%{HTTP_H ...

  3. USB描述符概述

    在USB总线接口协议中,规定了一些标准的USB描述符,如表所示. 对于USB设备来说,有些USB描述符是必需的,例如: 设备描述符 配置描述符 字符串描述符 接口描述符 端点描述符 其余一些描述符并非 ...

  4. java类型转化之Hbase ImmutableBytesWritable类型转String

    Hbase 的ImmutableBytesWritable类型一般作为RowKey的类型;但也有时候会把值读出来;故有了转化为string一说. ImmutableBytesWritable RowK ...

  5. sass中mixin常用的CSS3

    圆角border-radius @mixin rounded($radius){ -webkit-border-radius: $radius; -moz-border-radius: $radius ...

  6. POJ 1797 Heavy Transportation

    题目链接:http://poj.org/problem?id=1797 Heavy Transportation Time Limit: 3000MS   Memory Limit: 30000K T ...

  7. 2015GitWebRTC编译实录4

    2015.07.17 libg711 编译通过[422/1600 ] CC obj /webrtc/modules/audio_coding/codecs/g711/g711.g711.o[423/1 ...

  8. Javascript中的函数、this以及原型

    关于函数 在Javascript中函数实际上就是一个对象,具有引用类型的特征,所以你可以将函数直接传递给变量,这个变量将表示指向函数“对象"的指针,例如: function test(mes ...

  9. JavaScript 遗漏知识再整理;错误处理,类型转换以及获取当前时间、年份、月份、日期;

    1.JavaScript 错误处理 Throw.Try 和 Catch try 语句测试代码块的错误. catch 语句处理错误. throw 语句创建自定义错误. JavaScript 错误 当 J ...

  10. leetcode 125. Valid Palindrome ----- java

    Given a string, determine if it is a palindrome, considering only alphanumeric characters and ignori ...