(function(){
document.ready = function(fn){
if(typeof fn !== 'function'){
throw 'Fn is not a function!';
}
function completed() {
document.removeEventListener( "DOMContentLoaded", completed );
window.removeEventListener( "load", completed );
fn();
}
// 通过判断readyState状态如果已经加载完成直接执行,否则通过加载事件监听,由事件触发执行
if ( document.readyState === "complete" ||
( document.readyState !== "loading" && !document.documentElement.doScroll ) ) {
// Handle it asynchronously to allow scripts the opportunity to delay ready
window.setTimeout( fn );
} else {
// Use the handy event callback
document.addEventListener( "DOMContentLoaded", completed );
// A fallback to window.onload, that will always work
window.addEventListener( "load", completed );
}
}
})();
提取于JQuery3.5.1的ready函数
jQuery官方下载地址 https://jquery.com/download/
针对浏览器扩展注入改良版
const ready = function(fn){
if(typeof fn !== 'function'){
throw 'Fn is not a function!';
}
let loadFinallyTimer = null, loadFinallyTimes = 1200;
// 内部自调函数
function loadFinally() {
// 预防浏览器扩展注入过早,head和body还未加载完毕,导致的错误
let head = document.querySelector('head')
, body = document.querySelector('body');
clearTimeout(loadFinallyTimer);
if (!head || !body) {
if (loadFinallyTimes-- > 0) {
loadFinallyTimer = window.setTimeout(loadFinally, 100);
}
}
else {
fn();
}
}
function completed() {
document.removeEventListener( "DOMContentLoaded", completed );
window.removeEventListener( "load", completed );
loadFinally();
}
if ( document.readyState === "complete" ||
( document.readyState !== "loading" && !document.documentElement.doScroll ) ) {
// Handle it asynchronously to allow scripts the opportunity to delay ready
window.setTimeout( loadFinally );
} else {
// Use the handy event callback
document.addEventListener( "DOMContentLoaded", completed );
// A fallback to window.onload, that will always work
window.addEventListener( "load", completed );
}
}