gpt4 book ai didi

javascript - loadasync 函数导入的外部脚本什么时候执行?

转载 作者:行者123 更新时间:2023-12-03 17:22:49 25 4
gpt4 key购买 nike

// Asynchronously load and execute a script from a specified URL
function loadasync(url) {
var head = document.getElementsByTagName("head")[0]; // Find document <head>
var s = document.createElement("script"); // Create a <script> element
s.src = url; // Set its src attribute
head.appendChild(s); // Insert the <script> into head
}

JavaScript:The Definite Guide 介绍了这样一个异步加载外部脚本的功能。但是我不知道导入的脚本何时执行。一旦加载它的脚本完成运行?或者,在 window 上的加载事件发生之后?
考虑到函数的用途或引入的原因,答案很可能不是第一种情况,以下测试用例演示:

<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<script type="text/javascript">
(function loadasync(url) {
var head = document.getElementsByTagName("head")[0];
var s = document.createElement("script");
s.src = url;
head.appendChild(s);
}("external.js"));
</script>
</head>
<body>
<h1>This is a test page.</h1>
</body>
</html>

external.js中的内容:

alert("external script executed, dead loop");
while(true);

“h1”元素正常渲染,没有被外部脚本造成的死循环阻塞。这意味着导入的外部脚本会在稍后执行,而不是在加载它的脚本完成运行后立即执行。但具体是什么时候?

最佳答案

我相信它仍然在加载后立即执行,h1 是渲染是因为 js 文件仍然需要时间加载,而其他人可以完成渲染,我更改您的代码进行一些测试:

html部分:

<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<script type="text/javascript">
(function loadasync(url) {
var head = document.getElementsByTagName("head")[0];
var s = document.createElement("script");
s.src = url;
head.appendChild(s);
}("./js/external.js"));
window.onload = function() {
alert("window loaded");
};
</script>
</head>
<body>
<h1>This is a test page.</h1>
<div id="test">See the page</div>
</body>
</html>

external.js 部分:

alert("external script executed, dead loop");
var ele = document.getElementById("test");
alert(ele.innerText);

在我的浏览器中,警报的顺序是外部脚本执行,死循环 => 查看页面 => 窗口加载。因此,当您执行脚本时,它会将 script 标记添加到头部并开始加载它,而页面的其他部分则继续渲染。

但是,当您添加需要加载的内容时,window.onload 将等待该脚本 加载完毕。

我们可以从警报序列中观察到脚本在加载后立即执行。

关于javascript - loadasync 函数导入的外部脚本什么时候执行?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31203596/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com