將 jQuery 1.4.2 升級到 1.9.1 (Upgrade jQuery 1.4.2 to 1.9.1)

問題描述

將 jQuery 1.4.2 升級到 1.9.1 (Upgrade jQuery 1.4.2 to 1.9.1)

We have been using jQuery 1.4.2 in our web application. Recently it was suggested that we upgrade to a newer version. So far we are thinking about upgrading to 1.9.1 as we need to support IE7 and IE8. Our application uses bunch of plugins e.g. fancybox, cookies, tipsy, jcarousel and bunch of others. Plus we have a lot of script files, probably around 50 files. and then some scripts embedded withing the files. I feel like this is going to be a disaster!  Does anyone have any advice? We are not set on yet upgrading to 1.9.1. If I want I can convince the managers to upgrade to a different version. What is our safest bet? Please advise.

Thank you!

參考解法

方法 1:

Just look at the deprecated functions still in your code; the big ones to watch out for are .live() and .delegate() which have been replaced with .on(), .attr() for which .prop() is the replacement, and .browser(). I've been updating my code as new versions came along and it's been pretty easy (about 20K lines of js) so you shouldn't have any problems. Just start with the functions I mentioned and I think that'll solve most of the issues. Then, look at the Migrate plugin.

方法 2:

You can try to use jQuery Migrate plugins which is used to detect and restore APIs or features that have been deprecated in jQuery and removed as of version 1.9.

方法 3:

In addition to frenchie's answer, if your application injects custom html attributes from code‑behind, at the client‑side those attributes can still only be read using attr() instead of the new prop().

According to my current understanding this is because name‑value attribute additions to elements are only recognized as properties when they are either native to the DOM element type, or have been added using the same client‑side jQuery prop() method.

Doing a similar jQuery upgrade for the first time, I found this thread about the differences between attr and the new prop a very interesting read: prop‑vs‑attr

方法 4:

1. Do not use offset option in position properties, e.g. code $element.position({my: 'center center', at: 'center center', offset: '5 ‑10'}) should be replaced with $element.position({my: 'center center', at: 'center+5 center‑10'}).
2. Do not use $element.bind(), $element.live(), $element.delegate() to assign event handler, use $element.on().
3. Do not use browser sniffing with $.browser, try to use feature detection instead ($.support).
4. Do not use deferred.isRejected(), deferred.isResolved(), use deferred.state() instead. Do not use deferred.pipe(), the deferred.then() method should be used instead.
5. Do not use the $elements.size() method, use the $elements.length property instead. The .size() method is functionally equivalent to the .length property; however, the .length property is preferred because it does not have the overhead of a function call.
6. Checkbox/radio state in a .trigger()ed "click" event now has the same state as in a user‑initiated action.
7. Changed naming convention for .data() keys, e.g., ui‑dialog instead of dialog. (http://jqueryui.com/upgrade‑guide/1.9/#changed‑naming‑convention‑for‑data‑keys).
8. Do not use $.ui.contains(), use $.contains() instead.
9. Each widget instance already has unique identifier this.uuid and event namespace this.eventNamespace = "." + this.widgetName + this.uuid. Do not generate similar things manually.

Original upgrade guides and full list of changes:

• jQuery Core 1.9 Upgrade Guide
• jQuery UI 1.9 Upgrade Guide
• jQuery UI 1.10 Upgrade Guide

(by sayayin、frenchie、Eli、alpha pecap、Victor)

參考文件

1. Upgrade jQuery 1.4.2 to 1.9.1 (CC BY‑SA 3.0/4.0)