<!doctype html> <html> <head> <meta charset="utf-8"> <title>hello,angular2</title> <!--模块加载器--> <script type="text/javascript" src="lib/system@0.16.11.js"></script> <!--Angular2模块库--> <script type="text/javascript" src="lib/angular2.dev.js"></script> <script> //设置模块加载规则 System.baseURL = document.baseURI; System.config({ map:{traceur:"lib/traceur"}, traceurOptions: {annotations: true} }); </script> </head> <body> <img src="img/jay.gif"> <pre class="logger"></pre> <!--定义一个ES6脚本元素--> <script type="module"> //用ES6语法定义一个类 export class Logger{ constructor(){ this.el = document.querySelector("pre.logger"); this.lines = []; } log(str){ this.lines.push(str); this.el.textContent = this.lines.join("\n"); } } //实例化,测试一下 var _ = new Logger(); _.log("哎呦,不错哦!"); _.log("真的是用ES6写的噢!"); </script> </body> </html>