<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>vue.js的入门</title>
<!-- 导入 -->
<script type="text/javascript" src="./js/vue.js"></script>
<script type="text/javascript">
//单一入口
window.onload = function(){
//建立vue对象
var app = new Vue({
//el 属性用来绑定元素节点
el:"#app",
//data 属性用来绑定数据
data:{
message:'Hello World'
}
});
// 建立vue对象
var app2 = new Vue({
//绑定元素节点
el:"#app2",
data:{
message:'页面加载'+new Date().toLocaleString()
}
});
}
</script>
</head>
<body>
<div id="app">
<!-- vue的模板语法，用来输出变量 -->
{{ message }}
</div>
<div id="app2">
<!-- 把title属性和message变量联系起来 -->
<span v-bind:title="message">
请让鼠标悬停一秒钟，来观看这个页面刷新的时间
</span>
<div title="静态绑定信息">静态绑定</div>
<a href="#" title="这是一个空链接"> 悬停查看显示</a>
</div>
</body>
</html>