有什么区别window.onload,document.onready和body.onload？
你能列出使用jQuery 的区别onload()和$(document).ready(function(){..})功能吗？
我试图在body onload中加载2个javascript事件/函数,如下所示: -
<body onLoad="getSubs(document.form1.HotelID.options[document.form1.HotelID.selectedIndex].value);getTags(document.form1.HotelID.options[document.form1.HotelID.selectedIndex].value);">
每当我使用2个函数加载时,第一个函数就会中止 - 但是如果我只加载它就可以正常工作 - 我做错了是不可能在onload中放入2个函数？
由于单个网页可能包含大量外部资源:外部javascript,外部css,图像,applet,flash等,通常我的传统智慧告诉我,当所有链接资源下载完成后,会触发window.onload事件(虽然外部资源通常由浏览器的实现下载到多个线程或进程中.通常的情况可能在大多数时间都有效.但是......如果加载序列不是我认为理所当然的话,那么一些javascript bug可能会在某个地方蔓延.
在做了一些搜索之后,我发现事实并非如此.从这个页面:https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html,似乎在onload事件被触发时不加载图像.但是从这里window.onload vs <body onload =""/>,在我看来,onload被触发时会加载图像.通过此链接http://forums.mozillazine.org/viewtopic.php?f=25&t=413504&start=0&st=0&sk=t&sd=a,对我来说更加困惑.
所以我的第一部分问题是:当window.onload被触发时,是否所有资源都被加载了？
问题的另一个密切相关的部分是:在window.onload被触发之前,什么是资源加载顺序？我知道内部资源,如内部javascript或css,加载顺序是从页面顶部到底部(除非在IE中,使用延迟脚本,如此处所示,当页面DOM已加载时(但在window.onload之前) )).但是外部javascript和css资源呢？例如,如果我像这样写我的页面:
<external stylesheet...>
<external javascript #1...>
<external javascript #2...>
<script>
.....
window.onload=....
</script>
假设"外部javascript#2"中的函数调用"外部javascript#1"中的函数,我能确定它总是有效吗？另外如果window.onload调用"外部javascript#1"中的函数也可以按预期工作？
您可以说资源加载顺序以及何时触发window.onload事件取决于浏览器实现,如此处所述JavaScript中的事件优先级是什么？.但我仍然想知道公众是否有规范或惯例.那么请你转介我的资源或告诉我事实以清除我的困惑？
我最近在jsfiddle.net上,我看到这是一个配置选项.这让我觉得它可能有助于解决我遇到的问题:
我加载了多个图像(尚未升级到单个精灵),因此我无法使用我的控件直到它们全部下载...图像占用大部分下载时间,因此在前几秒我无法访问我的控件.
目前我正在使用这两个中的一个......两项工作.
window.onload = initialize_page
window.addEventListener('load',initialize_page);
有关
在OnLoad我的网页的处理程序中,我正在尝试检查是否所有图像都已正确加载.
我正在迭代所有<img>标签并用我的isImageLoaded()功能检查它们.不幸的是,我的功能仅适用于Firefox和IE版本8.
有什么建议我如何让它在IE 9和10中工作？
function isImageLoaded(img) {
// check for IE
if (!img.complete) {
return false;
}
// check for Firefox
if (typeof img.naturalWidth != "undefined" && img.naturalWidth == 0) {
return false;
}
// assume it's ok
return true;
}
更新:事实证明,主要的罪魁祸首是在IE9 +加载所有图像之前可以触发OnLoad.什么是检查页面中图像的更好的触发器？我更愿意一次检查它们而不是单独的OnLoad/OnError处理程序.
我的问题与这里提出的问题类似，但略有不同，window.onload vs <body onload=""/>
在那个问题中，它是使用 window.onload 和内联 js 之间的比较。
我的问题是以下内容之间的区别。假设 body 标签的 Id 为“bodyTag”。
document.getElementById("bodyTag").onload = function () {
alert("hi");
}
对比
window.onload = function () {
alert("hi");
}
确切地说，这两者之间有什么区别，我什么时候应该使用其中一种？这仅适用于纯 JavaScript。我是否正确假设不同之处在于 window.onload 直到整个网页加载完毕、所有样式都已加载、所有 Javascript 代码已加载后才会启动？虽然使用第一个版本 (document.getElementById("bodyTag").onload=)，但它等待整个网页加载（如果它在 head 中声明为外部 CSS 文件，则为 CSS 样式），但不适用于所有 Javascript装载？那是区别吗？
Jquery有一个很好的语言结构,如下所示:
$(document).ready(function() {
$("a").click(function() {
alert("Hello world!");
});
});
正如你可能已经猜到这一点,一旦该文件已加载,结合自定义功能,所有的onClick事件一个标签.
问题是,如何在Prototype中实现这种相同的行为？
<html>
<head>
<style type="text/css">
canvas { width: 100%; height: 100%; }
</style>
<script>
function init() {
canvas = document.getElementById('canvas');
alert(canvas.width + "x" + canvas.height);
}
</script>
</head>
<body onload="init();">
<canvas id="canvas"> </canvas>
</body>
</html>
此代码显示样式之前的大小.它是风格后我需要的尺寸.我怎样才能做到这一点？
这三个事件之间有什么不同？
哪一个在其他之前/之后加载？
<body>
<script type='text/javascript'>
$(document).ready(function(){
console.log('Document %s',+new Date());
});
$('body').ready(function(){
console.log('Body %s',+new Date());
});
$(window).ready(function(){
console.log('Window %s',+new Date());
});
</script>
<div>hello world</div>
</body>
奇怪的是,它们与我将它们放在代码上的顺序相同.对于当前的例子.document一个先发射,windows另一个发射.
ps我读过window.onload vs <body onload =""/>, window.onload vs document.onload和其他几个.
我有一个注册页面,有些JS仅用于此页面,而另一个JS用于3个不同的页面.所以,这个页面的JS只有我写的内部标签,以及第二个输入和外部文件,它包含在body标签中
代码示例
HTML
...
<script type="text/javascript" scr="src.js"></script>
<script type="text/javascript">
//some JS and jQuery code
</script>
浏览器以何种顺序加载网页？如果它正在读取HTML,当它找到第一个脚本时它是否加载此脚本,等待它完全加载然后继续读取HTML？
因为在内部JS中我使用了一些来自外部脚本的函数,比如jQuery $(document).ready()函数,我想知道,如果在DOM准备就绪时触发了这个事件,那么这意味着该函数是外部JavaScript ？
javascript ×11
html ×5
jquery ×3
css ×2
browser ×1
canvas ×1
dom ×1
events ×1
image ×1
loading ×1
onload ×1
portability ×1
prototypejs ×1