<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<!--引入vue-->
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
<style>
.bg{color:red;}
</style>
</head>
<body>
<div id='app'>
<div class="bg" v-bind:id='app1'>
hello,word!
</div>
<div class='bg'>
{{msg}}
{{count}}
{{count+1}}
{{(count+1)*10}}
<button type='button' v-on:click="submit()">计数 </button>
<button type='button' @click="submit()">计数 </button>
</div>
<a v-bind:href="url"> 百度 </a>
<a :href="url"> 百度 </a>
<div v-html='template'></div>
</div>
<script>
new Vue ({
el:"#app",
data:{
msg:"hello,vue!",
app1:'test',
count:0,
template:'<div>hello,baidu</div>',
url:"http://www.baidu.com",
},
methods:{
submit:function(){
this.count ++
}
}
})
</script>
</body>
</html>