在 .ejs 文件中使用 .js 文件中的函数

Question

我有一个 .ejs 文件，我正试图从该文件访问 .js 文件中的函数。这两个都包含客户端代码。我的问题是，当我尝试从 .ejs 文件调用该函数时，找不到该函数，因为 .js 没有被使用。

我在 .ejs 文件的标签中有一个 link 到 .js 文件。

有人可以帮我解决这个问题吗，因为我对 Javascript 还很陌生？

.ejs 文件内容：

...
<button type="button" onclick="overlayOn()">view comment</button>

.js 文件有一个函数叫做 overlayOn()

function overlayOn() {
    document.getElementById("overlay").style.display = "block";
  }

错误：

Uncaught ReferenceError: overlayOn is not defined
    at HTMLButtonElement.onclick

Answer 1

您可能必须将所有事件函数包装在文档加载函数中。来自 https://developer.mozilla.org/enUS/docs/Web/API/Window/DOMContentLoaded_event :

window.addEventListener('DOMContentLoaded', (event) => {
console.log('DOM fully loaded and parsed');
});

如果 DOM 在您的脚本文件运行之后加载，那么它们针对的是尚未加载的内容。作为额外的预防措施，请将您的脚本标记放在 body 元素的底部，以便在页面其余部分加载后运行s。希望这有效！

Answer 2

此问题已通过使用以下行得到解决：

app.use("/public", express.static('public'));

Using functions from .js file in .ejs file