如果须要访问,可以通过以下几种办法:

方法1:利用全局变量

可以将模块中的函数赋值给一个全局变量,然后在onclick中调用这个全局变量。

html调用模块Html中嵌入module类型的JavaScript代码若何拜访个中的函数 HTML
(图片来自网络侵删)

// 在模块中window.myGlobalFunction = function() {// 你的函数实现};// 在HTML中<div onclick="myGlobalFunction()">点击我</div>

方法2:利用事宜监听器

在JavaScript模块中通过addEventListener为<div>元素添加事宜监听器。
这样,你可以完备在模块化的环境中事情,而不必依赖全局变量。

<div id="myDiv">点击我</div><script type="module">import { myFunction } from './myModule.js'; // 假设myFunction是你想调用的函数document.getElementById('myDiv').addEventListener('click', function() {myFunction();});</script>

在myModule.js中,你只需正常导出你的函数:

// myModule.jsexport function myFunction() {// 你的函数实现console.log('函数被调用了!
');}

方法3:利用自定义数据属性

给div添加一个自定义数据属性(如data-action),然后在模块中通过事宜监听器检讨这个属性,并根据其值调用相应的函数。
这种方法供应了更多的灵巧性,但也须要你在模块中编写更多的逻辑来解析和调用函数。

<div id="myDiv" data-action="myFunction">点击我</div><script type="module">import as actions from './actions.js'; // 假设actions.js导出了多个函数document.getElementById('myDiv').addEventListener('click', function() {const actionName = this.getAttribute('data-action');if (actions[actionName]) {actions[actionName]();}});</script>

在actions.js中:

// actions.jsexport function myFunction() {// 你的函数实现console.log('通过自定义数据属性调用的函数!
');}

把稳:JavaScript开拓的功能,运行于浏览器,他人只需在浏览器中右键查看网页源码,便可得得到源码,可以剖析功能逻辑、可以复制、可以修正盗用。
为了防止代码被任意剖析、复制、盗用。
JavaScript开拓的功能可以用JShaman、JS-Obfuscator、JsJiaMi.Online等工具进行JS代码稠浊加密。