《Vue》 渐进式 JavaScript 框架
Vue.js
Vue.js 是什么
Vue.js（读音 /vjuː/, 类似于view） 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue 生态系统支持的库开发的复杂单页应用。
Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
“Vue.js” 一个js开发框架，国人的作品，以上是关于vue的介绍。
这是框架出现有过一段时间了，本人刚从安卓跳到前端过来，也接触过一些开发框架。用过Angular的朋友应该都知道，体积太大，用起来比较笨重。还有一款React,Virtual DOM 的存在使得和真实 DOM 隔了一层有时很不方便，函数式的架构使得组件之间的通信也难处理。(其实我没用过，网友说的_)。
不扯太多，来聊聊这个vue。“简主“（简书文章的作者，指本人，我自己起的名字^_&）刚接触前端的时候是从js开始的，相信大部分人也是这样，然后就是jquery，jquery是直接去操作DOM的，他弥补了前端的很多不足的地方。我从网上整理一些关于jquery的常用的功能：
1 、取得页面中的元素。如果不使用JavaScript 库，遍历DOM （Document Object Model ，文档对象模型）树，以及查找 HTML 文档结构中某个特殊的部分，必须编写很多行代码。jQuery 为准确地获取需要检查或操纵的文档元素，提 供了 可靠而富有效率的选择符机制。
2 、修改页面的外观。CSS 虽然为影响文档呈现的方式提供了一种强大的手段，但当所有浏览器不完全支持相同的标准时， 单纯使用CSS 就会显得力不从心。 jQuery 可以弥补这一不足，它提供了跨浏览器的标准解决方案。而且，即使在页面 已经呈现之后，jQuery 仍然能够改变文档中某个部分的类或者个别的 样式属性。
3 、改变页面的内容。jQuery 能够影响的范围并不局限于简单的外观变化，使用少量的代码，jQuery 就能改变文档的内 容。可以改变文本、插入或翻转图像、对列表重新排序，甚至，对HTML 文档的整个结构都能重写和扩充—— 所有这些只 需一个简单易用的API 。
4 、响应用户的页面操作。即使是最强大和最精心设计的行为，如果我们无法控制它何时发生，那它也毫无用处。jQuery 提 供了截取形形色色的页面事件 （比如用户单击一个链接）的适当方式，而不需要使用事件处理程序搞乱HTML 代码。此 外，它的事件处理API 也消除了经常困扰Web 开发人员的浏览器不一 致性。
5 、为页面添加动态效果。为了实现某种交互式行为，设计者也必须向用户提供视觉上的反馈。jQuery 中内置的一批淡入、 擦除之类的效果，以及制作新效果的工具包，为此提供了便利。
6 、无需刷新页面即可从服务器获取信息。这种编程模式就是众所周知的AJAX （Asynchronous JavaScript and XML ， 异步JavaScript 和XML ），它能辅助Web 开发人员创建出反应灵敏、功能丰富的网站。
jquery的功能已经给前端开发者带来了不少的福音，比如我们来实习一个简单的功能试试,这个demo演示的是在一个文本框里输入什么下面的值就会动态跟着改变，简简单单的几行代码就实习了这个功能：
·Jquery实现:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<title></title>
</head>
<body>
<div>
<input placeholder="edit me">
<p id="text"></p>
</div>
</body>
<script type="text/javascript">
$('input').bind('input propertychange', function() {
$('#text').html($(this).val());
});
</script>
</html>
·Vue实现:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="http://static.runoob.com/assets/vue/1.0.11/vue.min.js" type="text/javascript" charset="utf-8"></script>
<title></title>
</head>
<body>
<div id="app">
<input v-model="message" placeholder="edit me">
<p>{{ message }}</p>
</div>
</body>
<script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
</script>
</html>
