如何解决从 index.html
我在我的 javascript 文件中定义了 Class...我将该文件导入到 html 页面中:
<script type="module" src="./js/controller.js"></script>
我现在如何访问该 js 文件中的类? 我想要这样的东西(在我的 html 文件中):
<script>
let app = null;
document.addEventListener('DOMContentLoaded',function () {
//Init app on DOM load
app = new MyApp();
});
</script>
但它不起作用(我收到 Uncaught ReferenceError: MyApp is not defined)...如果我将此 DOMContentLoaded 侦听器包含在我的 controller.js 文件的末尾,它会起作用。但是我以这种方式丢失了对 app 变量的引用(我不想要)......有没有办法引用模块中定义的东西?
我想要该引用的最重要原因是能够从谷歌浏览器控制台访问我的应用程序对象...
谢谢!
解决方法
您可以通过以下方式从 html 访问 js 文件中的类-
我的 Home.html 文件:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>Page Title</title>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<script type="module">
import { Car } from "./main.js";
let obj= null;
alert("Working! ");
obj = new Car("Mini",2001);
obj.PrintDetails();
document.addEventListener('DOMContentLoaded',function () {
let obj2 = new Car("Merc",2010);
obj2.PrintDetails();
});
</script>
</head>
<body>
<h1> Lets try something <br></h1>
</body>
</html>
我的 main.js 文件:
export class Car {
constructor(name,year) {
this.name = name;
this.year = year;
}
PrintDetails() {
console.log(" Name = "+ this.name);
console.log(" year = "+ this.year);
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。