未定义来自外部文件的功能[JS]

问题描述

您好，我的JavaScript函数有问题。
我有3个外部JS文件，它们像这样包含在我的JS文件中：

var badgeJs = document.createElement('script');
badgeJs.type = 'text/javascript';
badgeJs.src = 'url'
document.head.appendChild(badgeJs);

所以这是我需要使用3个功能的问题，但有时会收到错误消息 Refference error: functionName is not defined之后，我刷新页面，第一个功能正常，但第二个功能不正常，每次刷新时都未定义某些功能。
我不知道问题出在哪里，为什么会这样？任何建议将不胜感激。
我不知道这是否有帮助，但是JS代码用于shopify-app

我如何调用函数

var content = 'function1(param);function2(param1,param2,param3,[10,25]);function3(param1,param2);';
(function() { var script = document.createElement('script'); script.text = content; var body = document.querySelector('body'); body.append(script);})();

解决方法

您的文件包含在您尝试调用函数的Sime时间运行。由于文件包含需要时间来加载文件，因此在加载函数之前要先调用它们。 您必须手动将脚本添加到HTML：

<script type="text/javascript" src="/to/your/file.js">

然后在加载DOM后运行您的函数：

document.addEventListener("DOMContentLoaded",function(event) {
    // Your code to run since DOM is loaded and ready
});

如果您无法更改HTML，请动态添加文件，并确保在加载文件时调用函数。