首页 > 解决方案 > 如何确保在事件侦听器触发后加载 Javascript 文件?

问题描述

我目前有一个事件监听器来监听要触发的东西。我希望在尝试加载 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>

标签: javascripthtml

解决方案


将脚本标记删除到 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>

推荐阅读