前言：很多人說jquey和vue沒有什麼可比的，應該和angular，react來比吧，我到覺得他們倒沒有多大的可比性，都是基於mvvm思想設計的框架，無非就是實現的方式不一樣，在不同場景下效能上會有一些差異。然而從jquery到vue或者說是到mvvm的轉變則是乙個思想想的轉變，是將原有的直接操作dom的思想轉變到運算元據上去，難道不是乙個根本性的改變嗎？
1.jquery介紹：想必大家都用過jquery吧，這個曾經也是現在依然最流行的web前端js庫，可是現在無論是國內還是國外他的使用率正在漸漸被其他的js庫所代替，隨著瀏覽器廠商對html5規範統一遵循以及ecma6在瀏覽器端的實現，jquery的使用率將會越來越低
2.vue介紹：vue是乙個興起的前端js庫，是乙個精簡的mvvm。從技術角度講，vue.js 專注於 mvvm 模型的 viewmodel 層。它通過雙向資料繫結把 view 層和 model 層連線了起來，通過對資料的操作就可以完成對頁面檢視的渲染。當然還有很多其他的mvmm框架如angular，react都是大同小異，本質上都是基於mvvm的理念。 然而vue以他獨特的優勢簡單，快速，組合，緊湊，強大而迅速崛起
3.vue和jquey對比
jquery是使用選擇器（$）選取dom物件，對其進行賦值、取值、事件繫結等操作，其實和原生的html的區別只在於可以更方便的選取和操作dom物件，而資料和介面是在一起的。比如需要獲取label標籤的內容：$("lable").val();,它還是依賴dom元素的值。
vue則是通過vue物件將資料和view完全分離開來了。對資料進行操作不再需要引用相應的dom物件，可以說資料和view是分離的，他們通過vue物件這個vm實現相互的繫結。這就是傳說中的mvvm。
4.舉例說明
場景一：列表新增乙個元素,下圖為vue和jquery兩種操作的**，我們從中可以看出vue只需要向資料message裡面push一條資料即可完成新增乙個li標籤的操作，而jquery則需要獲取dom元素節點，並對dom進行新增乙個標籤的操作，如果dom結構特別複雜，或者新增的元素非常複雜，則**會變得非常複雜且閱讀性低
vue:
} 新增資料
第2條資料
新增資料
場景二：控制按鈕的顯示隱藏，下圖為vue和jquery兩種操作的**，我們從中可以看出vue只需要控制屬性isshow的值為true和false即可，而jquery則還是需要操作dom元素控制按鈕的顯示和隱藏
vue:
} 新增資料
隱藏按鈕
jquery：
第2條資料
新增資料
隱藏按鈕
輸出結果：
4.總結：內容講的比較淺，主要就是分析一下vue和jquey對比的區別，上面兩個例子只是做了乙個簡單的說明，然而vue能解決的問題遠比這些要多的多，複雜的多。
vue適用的場景：複雜資料操作的後台頁面，表單填寫頁面
jquery適用的場景：比如說一些html5的動畫頁面，一些需要js來操作頁面樣式的頁面
然而二者也是可以結合起來一起使用的，vue側重資料繫結，jquery側重樣式操作，動畫效果等，則會更加高效率的完成業務需求
build目錄為webpack打包檔案，dist目錄為打包後生成的檔案，node_modules 引用的外部元件
資料新增div樣式
html 如下 js ulid a click function else if this is addpage else if this is pagenum else feepage load ownerfee 其中 feepage為另乙個html中有樣式的div的id。知識點 1 load方法...
CSS為div新增尖角樣式
先來看一下尖角效果 乙個div，右側邊框的上出現了乙個尖角的形狀。那麼如何來實現這麼乙個效果呢？1.原理 對於乙個塊級元素，但我們分別將元素的上下左右四個border設定成乙個比較大的畫素 如10px 樣式設定成solid 分別設定成不同的顏色的時候，同時將元素的width,height設定為0.這...
CSS為div新增尖角樣式
先來看一下尖角效果 乙個div，右側邊框的上出現了乙個尖角的形狀。那麼如何來實現這麼乙個效果呢？1.原理 對於乙個塊級元素，但我們分別將元素的上下左右四個border設定成乙個比較大的畫素 如10px 樣式設定成solid 分別設定成不同的顏色的時候，同時將元素的width,height設定為0.這...