[英]What is the difference between onLoad, onDomready, No wrap - in <head>, and No wrap - in <body>?
我使用JSFiddle来编辑我的代码。 但是，在某些代码中，当我运行JavaScript或jQuery时，除非我选择“No wrap - <head> ”或“No wrap - <body> ”，否则它不起作用。
在上面的小提琴中，您会注意到单击<button>元素不会alert()您，除非您选择了扩展名“No wrap - <head> ”或“No wrap - <body> ”。
我是一个好奇的人，喜欢理解事情的运作方式。 该选项究竟发生了什么变化，为什么要改变它？
onLoad ：
onLoad窗口事件中运行。 这在整个页面已加载（例如图像）时运行。 onDomReady ：
onDomReady窗口事件中运行。 这在DOM加载时运行。 没有换行<head> ：
<head>部分中 没有换行<body> ：
<body>部分中 我想指出，更多信息可以在jsFiddle的文档中找到。
onLoad和onDomready包装代码，以便在文档加载或DOM就绪事件触发时运行JavaScript。 这就像你写下你的代码一样：
<script type="text/javascript">
//<![CDATA[
window.onload=function(){ /* your js here */ }
//]]>
</script>
如果您将脚本标记添加到文档的头部或正文标记（如您可能习惯的话），则无包装选项。
<html>
<head>
<title>Stuff</title>
<script>
/* your code */
</script>
</head>
onload意味着页面中的所有源都被加载（包括图像css和js），domReady只意味着完成了dom树。
加载事件是一般的“加载完成”信号。 它受到许多元素的支持。 例如，外部SCRIPT和IMG，IFRAME在下载其内容完成时触发它。
当页面准备好时，DOMContentLoaded事件在文档上触发。 它等待完整的HTML和脚本，然后触发。除IE <9之外的所有浏览器都支持它。
有关onDomready更多信息。
下面是JSFiddle如何实际包装我们的代码来运行。 它们支持没有addEventListener方法的浏览器来监听DOMContentLoaded事件。
<script type="text/javascript">
//<![CDATA[
var VanillaRunOnDomReady = function() {
// Your own JS codes are placed here.
}
var alreadyrunflag = 0;
if (document.addEventListener)
document.addEventListener("DOMContentLoaded", function(){
alreadyrunflag=1;
VanillaRunOnDomReady();
}, false);
else if (document.all && !window.opera) {
document.write('<script type="text/javascript" id="contentloadtag" defer="defer" src="javascript:void(0)"><\/script>');
var contentloadtag = document.getElementById("contentloadtag")
contentloadtag.onreadystatechange=function(){
if (this.readyState=="complete"){
alreadyrunflag=1;
VanillaRunOnDomReady();
}
}
}
window.onload = function(){
setTimeout("if (!alreadyrunflag){VanillaRunOnDomReady}", 0);
}
//]]>
</script>
onLoad，onDomready和No wrap -in有什么区别 <head> 而且没有包裹 <body> 在HTML中？
[英]What is difference onLoad, onDomready, No wrap -in <head> and No wrap -in <body> in HTML?
ondomready和jquery的ready函数有什么区别？
[英]What is the difference between ondomready and jquery's ready function?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.