1.3 第一个vue页面

这是一个简单的html页面,带有vue的渲染功能
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js">
</script>
</head>
<body>
    <div id="app">
    {{ message }}      
</div>
    <script type="">
    var app=new Vue({
        el:'#app',
        data:{
            message:'Hello Vue!'
        }
    })
</script>
</body>
</html>
1.第4行代码是引入vue.js
2.第9行代码的{{message}}是等待vue渲染的变量
3.第12行代码到17是绑定一个数据
el代表element,元素,el:#app指定了id是app的元素,也就是第8行的div
data是el绑定的数据,可以绑定多个数据,这里只有一个数据message,它最终使用在第9行代码处
本页面运行的结果就是页面上出现Hello Vue

新建一个html文件,将上面的代码复制进去后,用浏览器打开,可以看到: