Question

请查看this image，其中包含

的快照

（a）目录结构，（b）main.js，（c）myModule.js，（d）index.html。

如果链接不起作用，目录结构为：

- root/
   - dist/
       bundle.js
   + node_modules/
   - src/
      main.js
      myModule.js
   index.html
   webpack.config.js

我有一个从myFunction导出的函数myModule.js，它以某种方式生成并播放MIDI音符。 button中还有一个index.html。现在，当用户单击按钮时（在浏览器中查看页面时），我想调用myFunction()。我怎么能这样做？

我在require中使用main.js来包含myModule.js的导出，并使用webpack创建bundle.js（请参阅image）。但后来我才知道node.js没有本机dom。

我发现，可以使用库/框架（例如React等）来完成。但无论如何不使用这些库就可以了吗？

Answer 1

在main.js中，将第二行替换为：

document.addEventListener('DOMContentLoaded', function()
{
     document
    .getElementById('myButton')
    .addEventListener('click', MyModule.myFunction());
});

然后捆绑

如何通过dom中的按钮单击事件调用函数（从节点模块导出）？

1 个答案: