触发window.onload事件时加载了哪些外部资源以及资源的加载顺序是什么？
当浏览器加载一个网页时，它会触发window.onload事件。在这个事件中，浏览器会加载一些外部资源，例如CSS样式表、JavaScript脚本、图片和其他媒体文件等。这些资源的加载顺序取决于它们在HTML文档中的位置和依赖关系。
以下是一些可能会被加载的外部资源：
- CSS样式表：这些文件定义了网页的外观和布局。它们通常在HTML文档的
<head>部分中引用。 - JavaScript脚本：这些文件提供了网页的交互性和动态功能。它们通常在HTML文档的
<head>或<body>部分中引用。 - 图片和其他媒体文件：这些文件用于显示网页上的视觉内容。它们通常在HTML文档的
<img>标签或CSS中引用。
在加载这些资源时，浏览器会按照它们在HTML文档中的顺序进行加载。但是，浏览器可能会并行加载多个资源，以提高网页加载速度。此外，如果一个资源依赖于另一个资源（例如，一个JavaScript脚本依赖于一个CSS样式表），那么浏览器会等待依赖的资源加载完成后再加载该资源。
总之，当window.onload事件被触发时，浏览器会加载一些外部资源，并按照它们在HTML文档中的顺序进行加载。这些资源包括CSS样式表、JavaScript脚本、图片和其他媒体文件等。
相关·内容
我有一个像这样的javascript代码
<script type="text/javascript">
window.onload=myFunction;
</script>
在<head></head>标记中和在</body>标记之前使用上面的代码片段有什么不同，因为我想在页面加载后调用我的函数。
浏览 1提问于2012-03-19得票数 3
回答已采纳
我想要建立一个简约的图片库，与缩略图显示内联。我希望它们在加载时不要加窗遮挡，我希望它们只是弹出，或者，如果有检测它们完成的方法，可以使用jQuery效果，比如快速的fadeIn()。
我设想了一行代码，如：
$(“.拇指-图像”).whenLoaded(fadeIn(500))；
但有这样的事件吗？这叫什么？
浏览 3提问于2010-07-25得票数 3
回答已采纳
2回答
如何检测是否按下了“重新加载”按钮，以及在此之后进程被保持，以及在重新加载之后。就像按下重新加载或Ctrl +R一样，我希望保存它在本地存储中重新加载。
浏览 3提问于2022-02-12得票数 2
回答已采纳
2回答
这还没有得到或的回答。这些问题的措辞都很糟糕，答案都是“使用DOMReady”。
我希望确保只有在页面完成加载后才能运行代码。我不能修改HTML文件本身，但是如果可以的话，我会做一些相当于这样的事情：
<!DOCTYPE html>
<html>
<head>
<script>window.loaded=false;</script>
</head>
<body onload="window.loaded=true;">
<!-- ... -->
&l
浏览 0提问于2012-05-26得票数 1
回答已采纳
我正在构建一个chrome扩展。
我想在页面加载时执行一个函数：
chrome.tabs.onUpdated.addListener( function (tabId, changeInfo, tab) {
if (changeInfo.status == 'complete') {
var tabUrl = tab.url ;
//code ...
}
});
这种方式需要很长时间来加载，并且在完成加载之后，它会开始另一次加载。另一种好的方法是什么？
浏览 0提问于2016-04-12得票数 0
我试图让我的div在我的页面上最后加载，我的意思是在加载完所有东西之后，它必须使用jquery或javascript加载那个div？
这是我尝试过的
<script type="text/javascript">
$(document).ready(function(){
$.get('url', function(data) {
$('.image').html(data);
});
});
</script>
浏览 0提问于2016-10-24得票数 0
3回答
我在一个模板化的网站上工作，它加载了页眉，页脚和动态主体。我有一个类，我在其中指定将根据当前页面和用户登录状态加载哪些脚本。我已经编写了一些jquery插件，当页面加载时，我需要通过
$(文档)函数(.ready(){ // $().thePlugin() })；
就我个人而言，在每个页面上不会有超过一个文档准备好的脚本来调用它，但我没有看到其他选择。让4到5个脚本调用该函数是不是不好的做法？
浏览 4提问于2010-02-12得票数 1
我真的不确定是什么导致了这种情况，或者它是否与Grails有关。
我有一个方法，我想先调用body load。然后是脚本标记中的方法，然后是第二个。我一直认为body onload方法调用应该首先调用--我想我错了。
警报的顺序是3，然后是1，然后是2。
有什么想法吗？
<html>
<head>
<title>${cname} Organization Chart</title>
<link rel="stylesheet" href="${resource(dir: 'css',
浏览 4提问于2012-10-09得票数 1
回答已采纳
2回答
我对jQuery非常陌生，我已经了解到，将首先加载DOM内容，然后才会发生window.onload事件，因为所有样式表和图像都必须加载。但是下面的代码并不适用于我
<!DOCTYPE html>
<html>
<head>
<title>Add Event Listener</title>
<script type="text/javascript" src="../jquery-3.2.1.js"></script>
浏览 3提问于2018-01-04得票数 1
回答已采纳
我有一个页面，很多广告都是一个接一个的加载。
我需要定位一个相对于整个页面高度的元素，因为添加了广告，页面高度在加载过程中发生了变化。
问题：当加载所有元素时，是否有jquery或类似的事件要检测？我目前正在与setTimeout“等待”，但这还远远不够好。
如果没有为xyz secs提出新的http请求，那么空闲事件将是很好的，如果没有向xyz secs发出新的http请求，则在分页之后触发一次。
浏览 2提问于2011-11-11得票数 3
回答已采纳
在internet explorer中，当onreadystatechange被触发，而readystate切换到完成时，onload事件是否同时触发?所有的请求都在这个时候完成了吗？
浏览 0提问于2011-01-27得票数 11
回答已采纳
1回答
延迟脚本是如何不同的预加载链接？
、、、、
预加载：获取CSS样式表并在以后的某个时间应用它，获取JavaScript资产并在以后执行，依此类推。预加载获取不阻止文档加载事件，并允许应用程序确定应用程序应用了哪些资源、何时执行这些资源以及按什么顺序执行。
延迟：在解析过程中“延迟”预加载，并且只有在解析器完成后才会执行。
我不能理解这两个概念的区别。在不阻塞解析器的情况下，这两种方法都可以异步获取，然后都可以在解析器完成时执行。
所以有什么区别吗？
浏览 5提问于2020-03-30得票数 7
1回答
我构建了一个在加载文档时拉入内容的应用程序，并注意到当页面初始内容加载时，窗口加载似乎会触发。真的是这样吗？有没有什么布尔魔术可以加到窗口加载事件中，让它等到初始内容和新内容完成？
下面是我正在做的工作
$doc.ready(function(){
/* Pull in conditional content */
});
$win.load(function(){
/* Fade page in once initial page content
and conditional content have both loaded */
});
浏览 2提问于2012-12-24得票数 0
回答已采纳
我有一个有50个缩略图的页面，一旦用户进入该网站加载。
我正在考虑创建一个loading... div，或者可能使用一个动画gif来显示缩略图图像仍在加载中，然后在加载后切换到图像。
使用纯JS或jQuery的最佳选择是什么，以及如何处理这样的事情？
提前感谢
浏览 2提问于2010-08-02得票数 1
回答已采纳
在JavaScript中，当我想在页面加载后运行一次脚本时，应该使用window.onload还是只编写脚本？
例如，如果我想有一个弹出，我应该写(直接在<script>标签内)：
alert("hello!");
或者：
window.onload = function() {
alert("hello!");
}
在加载页面之后，两者似乎都会运行。有什么区别吗？
浏览 4提问于2013-11-24得票数 56
回答已采纳
4回答
确保浏览器同时显示所有内容。
、、、、
我有这个网站，是沉重的图像和文本，在缓慢连接，互联网浏览器或计算机低内存，文字是先加载，然后图像需要一段时间来加载。我如何确保所有的东西同时显示出来？
我想过的解决方案：
输出缓冲- ob_start和ob_end_flush位于我的PHP脚本的顶部和底部，以确保在处理脚本之前没有发送任何内容。
将整个DOM加载到Javascript变量中，然后在加载完之后将其回显出来。
你认为哪一种方法能在所有浏览器上，甚至在速度较慢的电脑上都能工作呢？我还没有在不同速度和RAM的各种平台和计算机上测试过它。如果你有媒体网站的经验或有更好的方法，请让我知道走哪条路。
浏览 2提问于2012-10-25得票数 2
回答已采纳
我有一个单独的Javascript，它在标签下的相关html中提到。在Javascript文件中，我编写了一段代码，直到现在，当我单击一个按钮时，它才会执行。代码如下所示： document.getElementById('destination').addEventListener('submit', (event) => {//my code here}); 这里的“目标”是textbox的名称。但是，我想删除这个文本框和按钮，并在如下代码中执行这段代码： document.addEventListener('load', (even
浏览 35提问于2021-08-14得票数 0
我对何时触发window.onload事件感到有点困惑。例如:我有一个页面，它有很多外部js文件，甚至可以按需加载脚本(动态创建标记)。所有这些代码都在页面中(即.它不会在单击或smth时触发，它应该在加载时执行)。现在假设我在最后一个按需javascript中有window.onload =某个函数()。是否有可能在实际加载所有脚本之前触发window.onload？
浏览 1提问于2010-08-19得票数 29
1回答
我在我的Aspnet5 (Aspnet Core) WebAPI控制器中有一个操作，当被请求时，它可能会花费很多时间，即使用户已经取消加载，它也会运行到最后。在aspnet中是否有取消令牌的变体，或者在conroller/httpContext中有任何事件，可以帮助我在用户已经不需要其结果时停止操作？
如果使用cancellationToken，它永远不会更改其状态：
[HttpGet]
public async Task<string> Get(CancellationToken cancellationToken)
{
await Task.Run(() =>
浏览 0提问于2016-02-27得票数 1
我在chrome和safari中测试过，两者都有相同的结果。
当我尝试在window onload事件之后运行一个循环时，它会一直等待循环结束，然后再呈现上面的常规DOM。
但是，如果我通过setTimeout调用循环代码，即使它是0毫秒，它也会加载DOM，然后运行循环。
默认情况下，window onload事件不应该这样做吗？我想了解如何才能真正使javascript代码在DOM呈现之后运行。
谢谢。
<!DOCTYPE html>
<html lang="en">
<body>
<div id="root"
浏览 10提问于2022-03-19得票数 0
我试图为HTML主体的load事件附加一个侦听器。但是代码似乎没有运行(事件没有触发)。body元素有加载事件吗？如果是，下面的代码正确吗？现在，我只想让它在Firefox中工作。
index.html
<!DOCTYPE html>
<html>
<head>
<title>Testing</title>
<script type="text/javascript" src="script.js"></script>
</h
浏览 0提问于2010-12-09得票数 1
回答已采纳
我使用google转换的swiffy脚本，像这样
var stage = new swiffy.Stage(document.getElementById('swiffycontainer'),swiffyobject);
stage.start();
我的意思是我想在动画结束后做动作。但我不知道如何追踪斯威菲物体上的画面。
这是我的工作先问
在加载页面后，我将开始方法
$(文档).ready
$(窗口).load
window.onload =
并跟踪时间(随机测试以到达最后一帧)
setTimeout(callAtEnd(),10000);
结果:不工作；就像它
浏览 0提问于2013-09-20得票数 3
回答已采纳
我有这个脚本，灰显整个网站，并在文本'showPopUp‘被点击时弹出一个对话框。我的问题是，如何让这个脚本在页面加载时自动执行？
脚本：
<script type="text/javascript">
function showPopUp(el) {
var cvr = document.getElementById("cover")
var dlg = document.getElementById(el)
cvr.style.display = "block"
浏览 2提问于2012-11-05得票数 0
25回答
我正在使用<script>在<head>中执行一个外部脚本。
现在，由于脚本在页面加载之前执行，除其他外，我无法访问<body>。我想在文档被“加载”后执行一些JavaScript (HTML完全下载并在-RAM中)。在执行脚本时，是否有什么事件可以在页面加载时触发？
浏览 7提问于2009-04-30得票数 999
回答已采纳
1回答
我正在使用一些遗留的HTML/JS代码，其中我需要附加到load事件。
我正在使用的脚本位于<head>标记之外。
在头部外部附加侦听事件时，侦听load事件是否不可靠？
例如，有没有可能页面已经加载并忽略了我的事件侦听器？
在我的测试中，事件侦听器被触发得很好，但我要确保这种情况一直存在。
顺便说一句。由于遗留问题，我需要避免使用jQuery (不愉快的一天)。
浏览 2提问于2010-11-04得票数 0
回答已采纳
找出Javascript将运行什么以及何时运行的最佳方法是什么？我已经超出了在setTimeouts中放置函数来将运行代码推迟到我认为依赖项已经加载时运行的情况，等等。
浏览 4提问于2011-10-03得票数 0
我的扩展应该只在内容脚本注入的页面完全加载之后才加载内容脚本searchTopic.js (是的，我在扩展清单中将"run_at“设置为"document_end”)，但实际上它是在所有DOM对象创建之前加载的(关键对象是通过页面中的一些Javascript创建的)。所以，问题是，我如何才能等到页面的Javascript执行完毕？这是我的清单：
"content_scripts": [
{
"run_at": "document_end",
"matches": ["https://groups
浏览 4提问于2012-12-17得票数 40
回答已采纳
在加载DOM和CSS之后，我需要触发一些javascript，而不是图像。我相信那是在document.ready之后，但在window.onload之前。有人知道如何做到这一点吗？
我想在document.ready之后通过迭代document.styleSheets来加载CSS，但这感觉不是个好主意。
更新:这种不寻常的要求的原因是，我需要预测哪些图像将被渲染，这是由css决定的。将javascript移到页面底部可以解决这个问题，但是我希望我的脚本在不这样的情况下也能工作。
浏览 6提问于2014-05-27得票数 1
回答已采纳
4回答
我想在存储在Javascript中的数组的基础上，在html主体中创建一组按钮。下面是我的代码： <!DOCTYPE>
<html>
<head>
<script>
var listBrand =['LEXUS','AUDI','MAYBACK','FERRARI','TOYOTA'];
//the array
function pr
浏览 34提问于2018-01-14得票数 5
回答已采纳
我使用的是一个WebBrowser控件，有一个叫做DocumentCompleted的事件，这个事件会为网页中的每个框架以及加载的所有子文档(例如JS和CSS)触发。
我的问题是如何检测此事件的最后一个条目，我的意思是如何检测页面何时完全加载，并且此事件不会再次触发。
我找了很久，我找到了这样的解决方案：
void webBrowser1_DocumentCompleted(object sender,
WebBrowserDocumentCompletedEventArgs e)
{
if (e.Url.Equals(webBrowser1.Url)) {
浏览 4提问于2014-02-12得票数 2
好的，所以我正在做这个页面：。我必须动态计算几个css属性才能得到好的效果。问题是，如果我使用$(document).height()，那么第一次刷新之前(每个浏览器？！)使用$(document).height()的元素计算错误。你自己看看吧。在主页上的问题是右侧居中的文本"baw się...“在另一页上是左侧的主要照片。只需尝试刷新页面，您就会看到不同之处
你知道是什么导致了这个问题吗？
编辑: OK！我知道是什么问题了。可能浏览器加载和获取图形及其大小(宽度和高度)太晚了。新的问题是:如何检查图形是否已加载？
EDIT2:这是展示这个问题的视频：
浏览 0提问于2011-04-15得票数 1
回答已采纳
2回答
我已经创建了一个图像对象列表。每个图像的载列函数都是相同的：
function tracker() {
++loadedImage;
if (loadedImage === total) ..
}
images[i].src = urls[i];
此函数试图查看是否加载了所有图像，如果加载了，则调用另一个函数。但是，有几个源是非法的(可能不存在)，因此这些映像永远不会调用onload函数。即使对象被赋予非法来源，我也希望增加loadedImage。不过，我是否可以知道图片是否有非法来源？
谢谢。
浏览 2提问于2014-01-01得票数 0
回答已采纳
1回答
是否有某种IFrames事件仅在加载每个资源(脚本、图像、样式表、dom)时触发？基本上，我希望有一个加载图形显示在IFrame上，只有当一切都加载到里面时才删除它，这样用户就看不到一切都在加载。
目前我使用的是$(iframe).ready(function() { ... });，但是在加载任何东西之前，它会在很早的时候触发。
浏览 2提问于2010-08-05得票数 3
回答已采纳
我有jquery插件，但在页面加载时，它可以工作，但当我将它与我的php脚本集成时，它似乎无法加载。我有检查路径，但没有成功。页面加载后，我想让窗口显示onload，请检查我放在head标签中的代码，请原谅我的格式：
<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
<title>SimpleModal Basic Modal Dialog</title>
<meta name='author
浏览 2提问于2012-11-13得票数 0
我正试图在我的asp.net网页中运行我的javascript，但我不确定它是否能正常运行，因为所有的元素还没有加载。如何使用jquery确保我的脚本位于页面的最底部？这样它就可以在页面加载时运行吗？
浏览 1提问于2011-11-03得票数 1
回答已采纳
假设您有以下内容：
function doStuff() { //code }
这两种说法的区别是什么？
window.onload = doStuff;
window.onload = doStuff();
这两个语句都立即调用该方法，但如果使用第一个语句，则可以将onload视为指向"doStuff“的函数指针，然后使用以下方法再次调用该方法：
onload();
这是唯一的区别吗?一般来说，这是否都保证了事件处理程序的行为？
浏览 6提问于2013-12-31得票数 2
回答已采纳
3回答
如何检查页面重载是否完成
、、、
我有一个按钮，用户点击它提交一个表单，并在提交时重新加载页面。我想检查一下页面的重新加载是否完成。我尝试使用下面的方法，但它会在表单提交后立即发出警报，甚至在加载完成之前也是如此。
if(window.performance.navigation.type == 0){
alert('loaded');
}
如何检查加载是否完成。提前感谢！
浏览 3提问于2020-03-20得票数 4
3回答
我已经将这段代码加载到了body中的脚本中。
(function() {
attach = function() {
blablablablbalabl;
};
if (window.addEventListener){
window.addEventListener('load', attach, false);
} else if (window.attachEvent){
window.attachEvent('onload', attach);
}
})();
问题是，有时(5次尝试中有4次)
浏览 0提问于2010-12-27得票数 2
回答已采纳
我仔细阅读了问题，但IE让我很为难。
我想在背景图像加载后淡入一些图像，所以感谢你的解释，一切都在FF，Safari和Chrome上运行良好。但它似乎不能在IE上工作。在IE版本8 (8.0.7)的两台不同的计算机上试用过。
有人能给我这方面的建议吗？我的网站是
这是我的代码，位于我的script.js文件的底部：
$(window).load(
function() {
$("#allbirds").fadeIn(2000);
}
);
浏览 1提问于2010-10-26得票数 2
回答已采纳
我无法理解这个问题和我在网上找到的大量信息：
在我的项目中，JQuery加载了"defer“。由于项目标准的原因，这一点我无法更改。
<script defer src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js'></script>
现在我需要向一个页面添加一些小函数(当前是内联的)：
使用此设置，浏览器将尝试在jQuery加载=>之前执行内联脚本"Uncaught：$ is not defined“
<body>
...
...
浏览 2提问于2016-08-29得票数 8
回答已采纳
1回答
我目前正在尝试通过Node & PhantomJS从HTML页面生成一个PDF文档。
如果我的页面包含本地资源，或者只包含静态内容，它可以正常工作：
<!doctype html>
<html>
<head>
<meta charset="UTF-8" />
<link rel="StyleSheet" media="screen" href="./style.css" />
<link rel=
浏览 1提问于2014-04-03得票数 0
回答已采纳
2回答
我正在使用esapi作为输出编码。但是它的工作方式很奇怪。
码
<html>
<head>
<title> AC </title>
</head>
<body>
<style type="text/css">
.ac-container {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 12px;
浏览 3提问于2014-09-26得票数 0
在嵌入脚本时，如：
<script src="..." async defer></script>
有没有办法知道他们什么时候完成加载？
通常，当window.load事件被调用时，人们会期望所有脚本也都准备就绪。但我不知道当你用async或defer加载它们时，这是否仍然有效。我在网上读了一些文档，但找不到任何关于这个问题的结论。
浏览 1提问于2016-10-22得票数 25
回答已采纳
提前感谢您或您所能提供的任何帮助。我正在构建一个带有选择和选项的菜单。选择章节后，将显示可用的页面选项。然而，我希望它在网站首次加载时默认显示第一章页面，而不是什么都不显示。我似乎想不通这件事。我的代码如下： <script>
window.onload = function() {
document.getElementById("Chapter").onload = function () {
if (this[this.selectedIndex].value === "1") {
document.getEl
浏览 14提问于2019-04-16得票数 1
回答已采纳
我的父页面上的元素只有在隐藏的iframe包含一个div id时才会改变。
如果我让代码放在html页面上，一切都很好：
<iframe id="myiframe" style="display:none" onload="load()" name="myiframe" src="mysite.com"></iframe>
JavaScript：
function load(){
if (window.frames[0].document.getElementById('a
浏览 2提问于2013-03-18得票数 0
我只是想知道，如果我使用setTimeout来延迟加载外部映像和脚本的执行，Onload事件稍后会触发吗？
如果我将延迟设置为一个非常大的数字，那么Onload事件永远不会触发吗？
浏览 3提问于2021-07-25得票数 0
回答已采纳
google+是如何实现无限滚动()的？
示例页面：
我想知道触发他们使用的ajax加载的事件是什么？
在触发ajax加载之前，他们是否启动了对window.onscroll的检查，并检查pageYOffset是否具有某个值？(因为不知何故，我觉得这是一个相当肮脏的解决方案)
基本上，我想知道通常使用的技巧是什么，以及我们可以使用哪些其他技巧来模仿这种行为？
浏览 2提问于2011-08-10得票数 1
1回答
下面的脚本有一个小问题：
$(document).load('img', function(){
alert('images have loaded');
})
所有图像加载完毕后，该警报将弹出，这是正确的。但是，“img”在控制台中生成404警告。
GET http://www.website.com/img 404 (Not Found)
浏览 0提问于2014-04-27得票数 0
回答已采纳
1回答
我有一个PWA，它本质上是一个图书阅读器。因此，它需要大量的数据(即书中的文本)进行操作。当被Lighthouse分析时，它在页面加载检查中得分很低。 我的问题是:我可以采用什么方法来提高页面加载，同时仍然确保离线功能？ 我可以有一个最小的起始页(例如，只显示一条‘请稍等，正在下载文本’的消息)，然后动态下载(通过注入的脚本标签或AJAX) JSON数据文件。但是，我不确定接下来如何确保从缓存中获取数据。 只是想知道别人是如何处理这个问题的.
浏览 10提问于2019-01-05得票数 0
回答已采纳
我正在使用此代码在页面加载后立即触发一个函数：
function loadpapi(){
alert("Hello World!");
}
function pctaddLoadEvent(func) {
var oldonload = document.onload;
if (typeof document.onload != 'function') {
document.onload = func;
} else {
document.onload = function() {
if (oldonload)
浏览 0提问于2013-05-13得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
