標籤：

原生 JS 代碼和用 jQuery 實現效果各有什麼優劣勢？

01-05

  • 各種封裝，包括jq, dojo等等，主要目的就是爲了省心，拿jq來說：
    • JQ對不同瀏覽器的事件,DOM對象,都進行了封裝,各種操作都可以直接兼容各種瀏覽器, 要知道, 不同瀏覽器的區別不僅僅是在CSS里寫"-webkit-"還是"filter"的區別, 連事件模型這種底層的東西都不一樣= =
    • JQ特有的CSS-LIKE選擇器, 鏈式寫法, 封裝的各類animate函數, 封裝了的非同步載入, 都大幅提高了開發效率, 減少重複勞動
    • JQ用delay和一系列的函數封裝了AJAX操作, 這個功能目測還在不斷改進和完善. 反正是比JS省心就是了.
  • 其他就是有些常用函數JQ有所以不用自己寫了,你比如瀏覽器檢測...
  • 插件不斷豐富, 資料豐富 等等

當然,這樣也導致了

  • JQ比原生JS慢上 10倍(chrome)~100倍(ie). 具體數忘了, 反正是這個數量級的...尤其是有些人喜歡濫用選擇器和不用鏈式寫法
    • 所以說, 如果只用一句JS就可以解決的問題, 就不要用JQ了啊親...親測$("#x")比getElementById("x")慢40倍
      • 這是@TooBug兄的實測代碼http://fiddle.jshell.net/toobug/mZPXq/
  • JQ也不見得適用所有情況就是了, 網站規模更大就會凸顯JQ的不足. 比如沒有命名空間- -. 很多網站是根據自己的情況建立自己的函數庫.
  • 題外話, 如果項目相比"一個網頁"更偏向"一個APP"的情況, jq 不見得是最合適的

我現在理解題主的意思應該是在問用宿主環境（瀏覽器）原生的介面和 jQuery 封裝後的介面實現效果各有什麼優劣勢。

原生介面就好比剛採摘的草莓，jQuery 好比把剛採摘的草莓封裝進了泡沫箱。不用泡沫箱，貨物雖然最輕，但是不能堆放，保鮮期也短，也禁不住運輸過程中的顛簸。封裝起來雖然增加了重量但是解決了其他的一堆問題。一點重量上的損失換來這麼多好處何樂而不為呢。

-------------下面是12年的答案（jQuery 不是框架，官網說它是庫，謝謝 wang z 指正）-------------

不存在原生JS和jQuery的區別，用jQuery也是原生的JS，只存在用不用jQuery等框架的區別。

不使用框架的話可以根據自己的業務寫自己的代碼，更有針對性，沒有多餘的代碼；缺點是如果經驗不足的話代碼的兼容性和擴展能力較差，代碼抽象的層次較低，要想做好的話需要經驗和大量的時間和精力，最後也許會形成自己的框架。

使用框架的優勢是代碼兼容性較好，擴展能力好，抽象層次高，開發效率高，不需要太多經驗也可以上手；缺點是業務簡單時框架里的大部分代碼是無用的，框架掩蓋了一些問題的本質，對新手積累經驗無益。

還有一點要說的是框架的執行效率並不低，效率低是因為沒有用正確的方法使用框架。

javascript和jquery這兩者之間幾乎沒有可比性。

雖然jquery基於javascript，但是實際上jquery是和javascript完全不同的兩種語言，jquery實際上是一種邏輯式語言和純粹的函數式語言的結合體。由於這兩個特性，因此jquery對DOM的操作極度簡化。使用jquery往往可用一兩行代碼實現javascript原生代碼幾十甚至上百行代碼才能實現的功能。

但是jquery是一個特化的框架，它不是一個完整的解決方案，仍然離不開javascript。

如果想要一個基本上不依賴於原生javascript，可以嘗試Sencha。

談性能一般得看你的業務複雜度、開發能力、團隊規模，不能一概而論

1.業務複雜度高的項目或網站，開發能力不是很強的團隊，採用原生JS都會沒有機會讓你考慮性能，兼容性就是很大的障礙；

2.業務複雜度低，就Hello world的功能，就無所謂性能；

3.如果團隊牛叉、業務複雜的時候，代碼可維護性才是最重要的,性能調優只會在真正出現渲染瓶頸的時候才做；

4.性能還得往前看，知道Office為啥成功吧，因為他們一直往前看，電腦的處理能力越來越強了，啥問題都不是問題了。

某種意義上來說，不就是彙編語言和C語言的區別么？

剛入職的來說一句吧，我進的是幾家創業性質的小公司，做項目時，壓根就沒要求過性能要怎麼樣，只要你效率高。jquery用久了確實會產生依賴，現在都很少有機會碰原生js了，自己也知道這樣下去水平是得不到提升的。但是公司哪管你那麼多，你越快越好，所以很頭疼

jQ等框架解決易用性和兼容性問題，效率稍低

原生js解決運行效率問題，兼容比較麻煩

JQ的優勢是能讓程序員多活好幾年，原生js能讓程序員水平提高一個檔次

js：簡單的東西實現起來很複雜

jquery：複雜的東西實現起來很簡單

論性能，jquery差太多了

就目前看到的，大多數人用jquery無非兩個方面，一個dom選擇，以及衍生出來的.children,.siblings 等等，再一個就是event事件綁定，其他什麼循環，方法聲明啊，包括常用到的settimeout不都是原生的嗎。

我覺得jquery和原生根本不應該認為是對立關係，一個jquery高手肯定也會用到js類啊，理解原型鏈啊，理解dom這些東西，所以不應該認為用原生的就是厲害，用jquery就是不行這樣的想法。

你html結構複雜，用jquery選擇器再方便不過了，設計要求的效果特別苛刻，用jquery的動畫和特效再適合不過了，這些都是無可厚非的事情，但是你不可能一點不用到原生js而只用jquery吧，那是不可能的，變數聲明都是原生js。

所以面試的時候對面問你原生js用的怎麼樣的時候你大可自信的說，除了 dom 選擇和 eventlisterner不太熟以外，其他都沒問題

http://docdev.cn 裡面是1000多個幫助文檔，看了下還挺多，推薦給大家。 頂頂更健康

[http://docdev.cn](http://docdev.cn)

其實jquery和原生JS並沒有什麼很大的區別 jquery底層還是調用原生的JS 只不過jquery的api封裝了瀏覽器的差異性 為開發提供了便捷處理方式

js學好就都搞定了。jquery只是一個js的框架而已，js的框架多著呢。這個只是比較好而已。強烈建議學習js，做項目的時候用jquery就行了。

自己學習的時候 js的優勢就是你學到的東西更多一點處理瀏覽器之間的兼容問題之類的。會給你積累經驗。

做項目的時候jquery的有點就是效率高，開發成本降低了N倍。

後者是用前者編寫的函數庫，把我們平時經常用到的效果都封裝實現了，再使用時只需要調用即可。

需要DIY的話，當然還是要用到JS了。

$("&") 比 document.createElement 要慢十倍，如果$("&&....嵌套複雜的html結構&&")比innerHTML慢上百倍

阮一峰：jQuery最佳實踐

js是基礎，jQuery只不過是一種工具而已，基礎很重要

duang duang duang !!! 加特技 經過這麼多代的變遷，請不要再用效果來標籤JS了。 除了花哨的效果，JS現在做的事情挺多的，如果說現今的網頁是web app的話，js,html,css就是實現web app 界面的技術。 沒有什麼 duang duang duang 的特技。

推薦閱讀：

TAG:JavaScript | jQuery | 原生JavaScript |