區別:1、JQuery是一個JS庫,AngularJS是一個JS框架;2、Jquery與模型無關,Angular基于MVC模型;3、Jquery沒有雙向綁定功能,Angular有;4、jQuery適合回合式,Angular適合單頁應用等。
本教程操作環境:windows7系統、jquery1.10.0&&Angular6版本、Dell G3電腦。
AngularJS與JQuery之間的區別:
1、JQuery是一個JavaScript庫,用于DOM操作;AngularJS是一個JavaScript框架。
2、Jquery與模型無關; Angular是基于MVC,用于創建SPA(單頁面應用程序)。
3、Jquery沒有雙向綁定功能;而Angular具有路由,指令,雙向數據綁定,模型,依賴注入,單元測試等關鍵功能。
4、開發模式存在差異
AngularJS與jQuery在web應用開發模式上有著完全不同的思路:
-
jQuery: 通過顯示操作瀏覽器中的DOM來創建應用程序(適合回合式應用),對于大型及復雜項 目,不利于全面的單元測試;
-
AngularJS:將瀏覽器吸收為應用程序的基礎(適合單頁應用),擅長大型及復雜項目,便于全面的單元測試。
那什么是回合式應用和單頁應用呢?
回合式應用(Round-Trip Application)
在Web應用發展剛起步時,很多開發者都用的是回合式應用。
相較于單頁應用,它就相當于多頁應用吧。
-
優點:它對瀏覽器的要求少,能保證最大限度地對客戶端的支持;
-
缺點:用戶在下一個HTML文檔唄請求并加載之前必須等待,這個期間,它需要大型服務器端,也就是后端服務器來處理所有請求并管理所有的應用程序狀態,占用了許多帶寬(這時因為每個HTML文檔必須是自包含的,也就是每次更新頁面,都要把HTML文檔中更新的和未更新的內容完整的發送給服務器端,這就導致從服務器產生的每個響應中包含許多相同的內容)。
單頁應用 (Single-Page Application)
相較于回合式應用,單頁應用就是另辟蹊徑了。整個應用程序只有一個初始的HTML文檔被發送給瀏覽器,用戶交互所產生的Ajax(異步)請求只會請求較小的HTML片段,或者要插入到已有的顯示給用戶元素中的數據。
初始的HTML文檔不會被再次加載或者替換,在Ajax請求被異步執行時,用戶還可以繼續與已有的HTML進行交互。
-
優點: 減少向后端請求的數據量,減少了帶寬,提升了web應用的性能。
-
缺點:對瀏覽器的性能變高,不是所有瀏覽器都有兼容某些特性。