<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Vue挂载点与变量渲染</title> <script type="text/javascript" src="Vue.js"></script> </head> <body> // 挂载点 <div id="box"> // 使用{{变量名}},插值 <p>{{msg1}}</p> // 使用模板指令:v-text,通常是写到标签的属性中 <p v-text="msg1"></p> // 使用模板指令:v-html,可以将字符串中的html代码解析出来 <p v-html="msg2"></p> </div> <script type="text/javascript"> new Vue({ el:'#box',// 挂载到box上 // 数据模型 data:{ msg1:'Vue.js挂载点与数据渲染', msg2:'<h3 style="color:red;">渲染html代码</h3>' } }); </script> </body> </html>