<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Vue入门</title> <script src="../vue.js"></script> </head> <body> <!-- 挂载点、模板、实例之间的关系 挂载点是指用来被vue接管的dom元素 模板是指vue里template定义的将要应用于挂载点里的html元素 实例是指定义完模板跟挂载点定义完后 vue自动将内容解析到挂载点里 --> <div id="root">{{msg}}</div> <script> //创建vue对象 new Vue({ el: "#root",//挂载点，把页面中某个element交给vue接管 template: "<h1>{{msg}}</h1>",//vue 的模板 data: { //vue实例的数据 msg: "hellow word！" } }); </script> </body> </html>