Vue写hello world

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/weixin_38959210/article/details/80475904
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>hello world</title>
		<script type="text/javascript" src="js/vue.js" ></script>
	</head>
	<body>
   <div id="app1"></div>
   <div id="app2">{{message}}</div>

   <script>
   	
   	 /**********原生写法************/
   	  var dom=document.getElementById("app1");
   	  dom.innerHTML="hello world";
   	  
   	  
   	  setTimeout(function(){
   	  	dom.innerHTML="bye world";
   	  },2000)
   	  	 /**********VUE写法************/
   	  var app=new Vue({                 //创建实例
   	  	el:'#app2',                     //el表示实例负责的区域
   	  	data:{                          //数据
   	  		message:'hello world'  
   	  	}
   	  });
   	  
   	  setTimeout(function(){            //定时器
   	  	app.$data.message="bye world";  //VUE选择器
   	  },2000)
   </script>
	</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_38959210/article/details/80475904