[英]How to ensure Javascript file loads after event listener triggers?
我目前有一个事件侦听器，用于侦听要触发的内容。 我希望在尝试加载 js 文件之前触发该事件。 现在 JavaScript 正在加载，然后 api 就准备好了。 如何在加载 main.js 文件之前让 EventListener 完全完成？
<head>
<title>Default</title>
<script>document.addEventListener(apikey,function () {
console.log("ready");
});
</script>
<script src="./js/main.js"></script>
<script>console.log("js loaded")</script>
</head>
将 script 标签移除到 main.js。
在您的事件侦听器函数中，创建一个脚本标记并将其添加到文档中：
您的代码应如下所示：
<head>
<title>Default</title>
<script>
document.addEventListener(apikey, function() {
const myscript = document.createElement('script');
myscript.src = './js/main.js';
document.body.appendChild(myscript);
});
</script>
<script>
console.log("js loaded")
</script>
</head>
你可以这样做：
<head>
<link href="./js/main.js" rel="preload" as="script">
<script>
async function runScript(src) {
let script = document.createElement('script');
script.src = src;
document.head.append(script);
}
document.addEventListener(apikey, () => {
runScript('./js/main.js');
});
</script>
</head>
这种方法的优点是脚本将立即开始加载，而不管事件如何。 并且可以从事件中调用它而不会浪费额外的时间。
浏览器兼容性：预加载.
使用 Selenium 添加 JavaScript 事件监听器会自动触发它
[英]Adding JavaScript event listener with Selenium triggers it automatically
如何创建一个计时器，以在javascript中30秒后触发事件？
[英]how to create a timer which triggers an event after 30 seconds in javascript?
如果div的子节点都具有特定的类名，如何创建触发事件的Javascript侦听器
[英]How to create a Javascript listener that triggers an event once a div's children all have a particular class name
如何确保使用javascript更新select也会触发onchange事件监听器？
[英]How can I ensure that updating a select with javascript also fires the onchange event listener?
Javascript侦听器在事件目标的子对象而非实际元素上触发
[英]Javascript listener triggers on child of the event target, not the actual element
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.