javascriptapi设计(javascriptmodule模式调用的一个小坑)
导读:最近在玩Three.js,想把我们的3D检索,做成一个在线的公共平台。所以在可视化上,希望用Three.js来完成。我从来没写过js的代码。结果,在module的这个模式下遇到一个小坑,在这里记录一下。
1、一个简单的例子下面的代码是W3school里的案例。很简单。
<!DOCTYPE html>
<html>
<body>
<h2>我的第一段 JavaScript</h2>
<button type="button"
onclick="show1()">
点击这里来显示日期和时间
</button>
<p id="demo"></p>
<script>
function show1(){
document.getElementById('demo').innerHTML = Date();
}
</script>
</body>
</html>
简单运行,点击按钮会显示时间。
但是如果把模块改成module,会出错。
<!DOCTYPE html>
<html>
<body>
<h2>我的第一段 JavaScript</h2>
<button type="button"
onclick="show1()">
点击这里来显示日期和时间
</button>
<p id="demo"></p>
<script type="module">
function show1(){
document.getElementById('demo').innerHTML = Date();
}
</script>
</body>
</html>
终端显示,找不到show1这个函数。
2、问题的解决
经过多方查找,终于发现问题。module模式下,外部调用需要传递给window一个新的名称才行。
正确的代码如下:
<!DOCTYPE html>
<html>
<body>
<h2>我的第一段 JavaScript</h2>
<button type="button"
onclick="show1()">
点击这里来显示日期和时间
</button>
<p id="demo"></p>
<script type="module">
function show1(){
document.getElementById('demo').innerHTML = Date();
}
window.show1=show1
</script>
</body>
</html>
在使用Threejs过程中,遇到很多坑。大约还是业余的原因,就像刚开始学python一样。
但是,除去性能上的问题,js确实很强大。
,免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com