当脚本标签中有“模块”时，为什么 onclick 出现错误？

Question

我有带有功能的按钮，它看起来像这样：

<button onclick="myFunction()">Click</button>
<script type="module" src="main.js"></script>

还有 main.js 文件：

function myFunction(){
   console.log('Button has been clicked');
}

如果脚本标记中没有模块类型，它可以正常工作，但是当其中有模块类型时，控制台会抛出错误：

未捕获的类型错误：window.myFunction 不是 HTMLButtonElement.onclick 中的函数

如何修复它才能与模块正常工作？

Answer 1

模块中的默认范围是模块而不是全局。

使用 JavaScript 附加事件处理程序，addEventListener而不是 HTML 中的固有事件属性。