如何在 JavaScript 中检测 document.ready？ [复制]
Posted
技术标签:
【中文标题】如何在 JavaScript 中检测 document.ready？ [复制]【英文标题】：How to detect document.ready in JavaScript? [duplicate] 【发布时间】：2011-04-18 07:31:46 【问题描述】：可能重复：$(document).ready equivalent without jQuery
我有一个在加载时执行的无框架 javascript：
function myJs()
// some code
window.load = myJs;
但这会导致脚本执行延迟。我希望能够在文档准备好进行操作时立即执行此脚本，甚至在页面完全完成加载之前。如何以跨浏览器兼容的方式完成此操作？换句话说，如何：
$(document).ready(function()
//
);
jQuery的用纯JS说？
【问题讨论】：
打开jquery查看.ready函数。 【参考方案1】：你可以在任何你不会的地方创建一个函数，调用它
`<body onLoad="function();">`
【讨论】：
【参考方案2】：放
function myJs()
// some code
在<head></head>
和
window.load = myJs;
就在</body>之前
【讨论】：
你能解释一下而不是-1 ing我。也许我会学到一些东西。.load 与.ready 不同——.load 在执行前等待所有图片、脚本、外部资源等加载完毕，而.ready 在所有 DOM 资源加载完毕后执行加载（即 html 结构）。因此，如果一个页面同时具有.ready 和.load，则.ready 将在.load 之前执行
我看到并经过反思（在我重新阅读问题后，我误解了）我同意。但是，然后，@Josh Stodola，而不是这个蹩脚和无用的答案和 -1 ing 每个人，为什么不直接用这个解释回答这个家伙呢？ :) 我很确定这是 *** 回答和解释的目标（即使我刚刚注册）
@Couchenos 很好，我刚刚去投票了你在其他地方的两个很好的答案。这不是一个好的答案，所以我投了反对票。大不了。我不需要解释自己......很明显，这个答案是不正确且具有误导性的。
@Josh Stodola ：如果看起来是这样，请原谅我，但我不怪你 -1，而是像“Ummmmmmmmmmm no”这样的评论并且没有解释。这对您来说似乎很明显，但对所有试图提供帮助的人来说并非如此；）。更重要的是，如果您没有正确回答原始提问者！仍然我的回答是错误的，它没有回答我误读的问题，所以我应得的。我不在乎我的“分数”或它的名字。【参考方案3】：
//old IE
document.onreadystatechange = function()
if (this.readyState === "complete")
//whatev
;
//for everyone else
document.addEventListener("DOMContentLoaded", function ()
//whatev
, false);
【讨论】：
唯一原生支持DOMContentLoaded的IE版本是9。
旧版IE改为onDOMContentLoaded，谢谢提醒。
不是 100% 确定，但很确定 IE on。而且我认为您的意思是在 attachEvent 函数中添加“on”。【参考方案4】：
我已经做了一个你可以使用的实现（基于 jQuery 中的那个）：http://github.com/jakobmattsson/onDomReady/blob/master/ondomready.js
【讨论】：
嘿，对 js jere 很陌生。您能否展示如何实现这一点。我会做类似的事情： onDomReady(function() //code here ); ? 你完全正确:) 如果您愿意，也可以使用不同的 code-sn-ps 多次调用 onDomReady。它们都将按顺序执行。如果还不清楚，您必须在拨打电话之前包含我的代码。此外，如果您想更改函数的名称（“onDomReady”），请仅在第 10 行进行。 效果很好，非常感谢！【参考方案5】：实际上并没有那么糟糕。您需要一种将事件添加到document 的方法，以及这些事件应该是什么的知识。使用标准的addEvent函数
function addEvent( obj, type, fn )
if (obj.addEventListener)
obj.addEventListener( type, fn, false );
else if (obj.attachEvent)
obj["e"+type+fn] = fn;
obj[type+fn] = function() return obj["e"+type+fn]( window.event ); ;
obj.attachEvent( "on"+type, obj[type+fn] );
您可以执行以下操作：
// IE
addEvent(document, 'DOMContentLoaded', function()
alert('ready');
);
// Other
addEvent(document, 'onreadystatechange', function()
if (document.readyState == 'complete')
alert('ready');
);
// For demonstration purposes, show a 'load' event
addEvent(window, 'load', function()
alert('load');
);
IE 事件处理程序不会在其他浏览器中触发，反之亦然。
【讨论】：
你交换了 IE 和其他我猜的【参考方案6】：但这会导致脚本执行延迟。 我希望能够在文档准备好后立即执行此脚本 甚至在页面完全加载完成之前进行操作。
你可以通过三种方式来解决这个问题：
-
正如一些人已经建议的那样，您可以从 jQuery 源代码中汲取灵感并将其集成到您的脚本中。 （我推荐看Paul Irish on jQuery Source和看JS Libs Deconstructed。
您可以将函数调用放在 body 标记的末尾而不是 head 标记中。这允许在脚本启动之前加载所有 DOM 元素。
如果您不需要使用 DOM，则可以将其设置为自执行函数，这样您就不必等待任何事情。
(function startNow()())
【讨论】：
以上是关于如何在 JavaScript 中检测 document.ready？ [复制]的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 javascript 从 html 表中搜索数字？
如何在 JavaScript 中检测 document.ready？ [复制]
如何在浏览器 JavaScript 中检测 OS X 是不是处于暗模式？ [复制]