Home » jQuery 資源

jQuery 1.9 及 jQuery 2.0 Beta 一起手牽手出場囉~


最近半年雖然很忙,但都還是有在注意 jQuery 的新動向的,像在昨晚(美國時間 2013/01/15)就第一時間看到 jQuery 1.9 及 jQuery 2.0 Beta 發佈的消息。

jQuery 1.9 下載位置
正常版本:http://code.jquery.com/jquery-1.9.0.js
壓縮版本:http://code.jquery.com/jquery-1.9.0.min.js

GoogleMicrosoft 也馬上提供了最新版的 CDN 服務咧:
Googlehttps://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js
Microsofthttp://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.0.min.js

那~同時有兩個版本存在,這有什麼區別及用途咧:

1.jQuery 1.9 及 2.0 使用相同的 API,同時像 $.browser 等數 API 在這兩版本中都被移除了,更多相關的修改請參閱:jQuery 1.9 升級指南

2.jQuery 1.9 像之前的版本一樣可以在 IE6、7 及 8(舊版 IE) 中正常的執行,所以建議各位將現在所使用的 jQuery 版本升級到較簡潔的版本吧!

3.jQuery 2.0 將不再支援舊版 IE 囉!但也因為移除了為了相容舊版瀏覽器的各種條件判斷,所以讓 2.0 的效率及檔案都比 1.9 來的好及輕量唷!

4.jQuery 官方團隊在未來會同時維護 jQuery 1.9 及 2.0,所以各位可以依專案對於瀏覽器的要求來選擇所需要的版本吧!

也因為 jQuery 1.9 及 2.0 中移除了蠻多 API,所以開發團隊特別準備了 jQuery Migrate 外掛,讓各位在升級過程中可以先利用它來檢查看看現在用到的那些 API 已經被移除了,同時它也能在不修改任何程式的情況下恢復原有的功能喔!不過就算加上去,jQuery 2.0 一樣還是不支援 IE6、7 及 8。

jQuery Migrate 1.0 下載位置
正常版本:http://code.jquery.com/jquery-migrate-1.0.0.js
壓縮版本:http://code.jquery.com/jquery-migrate-1.0.0.min.js

既然 jQuery Migrate 是個外掛的話,所以在引用時的順序也一樣是:

1
2
<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.0.0.js"></script>

所以當我在程式中使用到了被移除的方法時:

檢視原始碼 JavaScript
1
$.browser;

那麼在像是 Chrome 的開發者工具的主控台中就會顯示以 JQMIGRATE 開頭的警告訊息:

當然我們也可以在舊有的 jQuery 版本中加入 jQuery Migrate 來進行測試,最舊可以測到 jQuery 1.6 版。換句話說,就是 jQuery Migrate 支援 1.6(含)以上的版本啦!若真的出現警告訊息的話,建議看一下 jQuery Migrate 說明文件的說明及修正方式。

接下來就來看看在 jQuery 1.9 中新增的功能吧!

1.更有效率的 API
許多過時及沒效率的功能已被刪除,相關的內容請參閱:jQuery 1.9 升級指南

2..css() 可以一次取得多個屬性
舊的 .css() 一次只能取得一個屬性,現在新的 .css() 可以透過傳入一個屬性名稱的陣列來取得一個包含多個屬性的物件:

檢視原始碼 JavaScript
1
2
var dims = $('#box').css([ 'width', 'height', 'backgroundColor' ]);
// { width: "10px", height: "20px", backgroundColor: "rgba(0, 0, 0, 0)" }

3.支援跨瀏覽器的 CSS3 選擇器
jQuery 1.9 新增支援更多的 CSS3 選擇器::nth-last-child, :nth-of-type, :nth-last-of-type, :first-of-type, :last-of-type, :only-of-type, :target, :root 及 :lang

4..finish() 函式
該函式可以結束單一元素上所有的動畫(包含還在排隊的)並立即顯示最後的結果。

5.支援 Source Map
雖然在產品上線時是使用壓縮版的 jQuery,但我們一樣可以利用 Source Map 的機制針對未壓縮版的來除錯。目前支援 Source Map 功能的瀏覽器只有 Chrome,但 Firefox 已經計劃要支援囉!

6.錯誤修正
當然每次少不了的就是修正了一堆跟 IE6、7 及 8 有關的問題囉,想了解修正了那些的話,可以看看 Change Log

至於想要直接使用 2.0 的話,基本上都跟 1.9 是一樣的,只是差在不支援 IE6、7 及 8 而已,所以一樣是先啃啃 jQuery 1.9 升級指南 囉。

把 jQuery 2.0 使用在現代瀏覽器中是個很棒的選擇,不過若擔心在 IE6、7 及 8 真的有問題的話,可以利用 IE 特有的條件註解來選擇使用版本:

1
2
3
4
5
6
<!--[if lt IE 9]>
	<script src="jquery-1.9.0.js"></script>
<![endif]-->
<!--[if gte IE 9]><!-->
	<script src="jquery-2.0.0.js"></script>
<!--[endif]-->

雖然 jQuery 2.0 已經比 1.9 版少了 10% 以上的檔案大小了,但相信在官方團隊的努力下,我們會有越來越方便及有效率的 jQuery 可使用的!

4 筆針對 jQuery 1.9 及 jQuery 2.0 Beta 一起手牽手出場囉~ 的迴響

  1. 男丁大大可以介紹這個jquery嘛?

    http://demo.pixelentity.com/?estro

    看起來很棒,我想做個網站來展示珠寶,用這個似乎不錯。

    因為這jquery要收費,所以大大需要的話我email給大大,裡面js資料夾好多js檔,根本分不清哪個是哪個。

    看看大大有沒有興趣"解析"這個jquery。

發表迴響