Vue入门第一课 挂载点、模板与实例，实现单击文字切换功能（零基础入门版）

为了冲进前端的大门，小编踏上了学习Vue.js的不归路，从今天起就开始和大家分享学习之路啦。
基础知识的话HTML5、JavaScript肯定必不可少，当然，小编实名羡慕java好的小伙伴，我真的是跌在java上千千万万遍。好了，进入正题，我就直接上干货啦。
首先是工具：pc机+Hbuilder就可以啦。(当然其他编译软件也行)
前期准备：Vue下载在Vue.js官方网站http://cn.vuejs.org/点击学习->教程->找到安装（绿色）->开发版本,下载到自己想要存放的位置。
正式开始：打开Hbuilder->单击文件->新建项目->(自行命名)创建。将刚刚下载的Vue.js复制（Ctr+C）单击你创建的项目粘贴上去（Ctr+v）。刚建的项目右键->新建（new）->html文件->创建。

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8">

		<title>vue入门</title>

		<script src="./vue.js"></script>

	</head>

	<body>

	 <div id="root"><!--挂载点间内容为模板-->

	  <div v-on:click="handleClick">{{content}}</div>	<!--"v-on:"可简写为@>

	  <!--

		 {{msg}} <!--div为挂载点

	    <h1>{{number}}</h1><!--插值表达式{{}} 

	  -->

	  </div>

	 <!--

	 插值表达式还有：

	 <h1 v-text='content'></h1>显示为<h1>hello<h1>

	 <h1 v-html='conent'></h1>显示为hello

	 -->

	 </div>

	 <script type="text/javascript">

	 	new Vue({

			el:'#root',/*el:让Vue实例接管某一元素，即与哪一DOM节点绑定，“#”千万不要忘记，Hbuilder不会报错，一个bug卡一下午都是正常的*/

			/*

			data:{

				msg:'hello world',

			    number:123

			},

			*/

             //data存放数据

			data:{

				content:'<h1>hello<h1>'

			   },

            //方法

			methods:{

				handleClick:function(){

					this.content = "world"//点击后hello变为world

				}

			}

			

		})

	 </script>

	</body>

</html>

第一次分享不太聪明的亚子，大家将就着看吧，都要多练多实践呀，今天也Vue宠（虐）爱（我）的一天！