[color=#ffffff]空格[/color]前端技术的出现是为了将DOM的交互操做从整个WEB站点开发中独立出来,进而进行更加高效的管理 。随着AJAX技术的出现,前端页面上的用户操做愈来愈多,愈来愈复杂,之前的不少用户请求均可以经过AJAX无刷新的操做来完成。 一般AJAX的流程为:用户使用XMLHTTPRequest建立HTTP请求来获取服务端的数据或一段HTML结构内容,请求成功后在页面上进行增长、修改、删除DOM元素的操做。 到目前为止,这种操做经历了3个阶段: 第1阶段:原生及jQuery阶段。用原生手段获取并操做DOM过于复杂,因而jQuery诞生了。 第2阶段:MV\*阶段。随着AJAX技术盛行、SPA普遍应用,每次数据请求后进行数据渲染和事件绑定,用户操做后进行另外一部分数据的请求和事件绑定,后面以此类推,最终代码会乱成一锅粥,因而MV\*诞生了。它将页面上与DOM相关的内容,抽象成:数据模型(Model即M)、视图(View即V)、事件控制函数(Controller即C,或Presenter即P,或ViewModel即VM)。(1)MVC,C监听V的变化,C手动改变V。(2)MVP,V触发P的动做,P手动改变V。(3)MVVM,V触发VM的动做,VM自动改变V。表明框架为Angular.js。 第3阶段:Virtual DOM阶段。在MV\*里,一个DOM的改变将会致使大量重复渲染,因而Virtual DOM诞生了。用Virtual DOM控制页面DOM结构更新的过程:建立原始(页面或组件)的Virtual DOM,用户更新DOM后建立新的Virtual DOM,对比两个Virtual DOM,把Virtual DOM的变化部分添加到DOM树上,最后渲染到页面上。表明框架为React.js,在React.js中,render执行的结果获得的并非真正的DOM节点,结果仅仅是轻量级的JavaScript对象,即Virtual DOM。