在 HTML 元素中通过 onClick 调用函数

Question

通过 DOM 操作，我们可以访问我们的 html 元素并为其添加相应的功能。 但是有没有办法（我想不出一个用例，只是好奇）反过来做呢？ 所以想象一下我们在 index.js 中有我们的函数

function sayHi(){
   alert('hi')
}

我们的 index.js 连接到我们的 index.html，然后我们可以以某种方式调用元素本身的函数吗？ 因为以下工作：

<button onClick="alert('hi')">click me</button>

那么有没有办法做类似的事情：

<button onClick="sayHi()">click me</button>

并使它工作？

Answer 1

是的，只要您调用的函数在全局范围内，这是可能的。

 function sayHi(){ alert('hi') }

 <button onClick="sayHi()">click me</button>

但是，如果您要维护一个更大的应用程序，您可能应该使用像 React、Vue、Angular 或 Svelte 这样的声明性框架。