jQuery 1.9 was released on January 15, 2013. The version marks an important milestone in jQuery’s evolution:
- several deprecated features have been removed to provide a slimmer, cleaner library in preparation for version 2.0
- it will be the last to support IE6, 7 and 8 (more about that below).
Don’t rush off and download it just yet — there are a number of migration issues to consider. The long list of 1.9 changes means few sites are likely to escape unscathed.
jQuery Migrate Plugin
The jQuery Migrate Plugin should ease your upgrade woes. The plugin provides two essential facilities:
- it re-enables deprecated features so your v1.8-compatible code will work again, and
- it logs warnings to the developer console when deprecated features are used. You should find it easier to fix issues.
The migrate plugin should be loaded immediately after jQuery, e.g.
<script src="https://code.jquery.com/jquery-1.9.0.js"></script>
<script src="https://code.jquery.com/jquery-migrate-1.0.0.js"></script>
It can also be used when (if?) you upgrade to version 2.0.
Removed Features
This should not be considered a definitive list of removals, but they are the most likely to cause compatibility problems. As always, thorough testing is your best option…
- jQuery.browser() — removed
- .live() events — use .on() instead
- .die() — use .off() instead
- .andSelf() — use .addBack() instead
- .add() — nodes are now returned in document order with disconnected nodes (those not in the document) at the end. All sets which contain disconnected nodes follow this behavior
- .after(), .before(), .replaceWith() — now return an unmodified jQuery set
- .appendTo, .insertBefore, .insertAfter, .replaceAll — if no elements can be selected by the target selector, e.g.
$(elements).appendTo("#not_found"))
, the resulting set is now empty - Ajax events must be attached to the document — not a DOM node, i.e.
$(document).ajaxStart(...);
rather than$("#node").ajaxStart(...);
- radio/checkbox click events — now returns the checked state rather than the state it would have been in if .preventDefault() were not called
- Order of focus events — blur events on the previous element are now fired prior to focus events on the new element
- jQuery(htmlString) — htmlString is only considered to be HTML (rather than a selector) if it starts with a ‘<‘ character
- .attr() — you should normally use .prop()
- “hover” pseudo-event — “hover” is no longer supported as a synonym for “mouseenter mouseleave”
- jQuery.ajax returning an empty JSON result — this is now considered to be malformed JSON and throws an error
New Features
Other than streamlining and bug fixes, there are relatively few new features…
.css() multi-property getter
It’s now possible to pass an array of CSS property names to the .css() method. It returns an object with the current values, e.g.
var dims = $("#box").css([ "width", "height", "backgroundColor" ]);
// { width: "10px", height: "20px", backgroundColor: "#D00DAD" }
CSS3 selector support
The Sizzle selector engine supports the following CSS3 selectors in all browsers: :nth-last-child
, :nth-of-type
, :nth-last-of-type
, :first-of-type
, :last-of-type
, :only-of-type
, :target
, :root
, and :lang
.
.finish() method
The .finish() method stops all queued animations and places the element(s) in their final state. This could be handled in previous editions using combinations of .stop() and .clearQueue(), but .finish() is easier to use.
Source map support
Source maps allow you to debug a production site which uses minified scripts or CSS. In essence, the browser’s debugger maps lines in the compressed file to the uncompressed source so it’s easier to view code, set breakpoints, change values etc. Look out for further articles on SitePoint soon…
Abandoning Legacy IEs
The ‘oldIE’ decision has divided opinion; some developers consider it premature, while others think any idea which aids the demise of IE6, 7 and 8 is a blessing. I have a number of concerns:
- StatCounter estimates IE6/7/8 usage to be around 13% and NetMarketShare places it 32%. Whatever you believe, legacy IEs are not dead and unlikely to be buried by the time jQuery 2.0 arrives.
- The jQuery team recommend conditional comments to load either jQuery 1.9 or 2.0 depending on the user’s device. It’s browser sniffing — a practice which should never have arisen in the late 1990s!
- It’ll cause confusion. It doesn’t matter how many warnings are issued, some developers will install jQuery 2.0 without understanding the backward compatibility risks.
- jQuery 2.0 will have an identical API to jQuery 1.9 (with oldIE code removed). Forking the code base will inevitably have consequences — especially as the v2.0 line evolves. You’ll require more thorough browser testing and how will you handle problems which arise in one version but not the other?
- While there’s still work to be done, jQuery 2.0 beta is 10% smaller than 1.9. Let’s assume the team double that saving; the initial jQuery download will reduce by 6Kb. Will that result in noticeably faster browser response times? I doubt it.
- The jQuery team will find v2.0 development easier, but what are the benefits to jQuery users? The library won’t necessarily execute faster — it already runs native browser APIs when they’re available. Which core features cannot be implemented in IE6/7/8?
- Browser compatibility is one of jQuery’s biggest strengths. Without IE6/7/8 support, there’s less reason to use the library. Raw JavaScript is faster and mostly consistent in the other browsers.
- Is the primary objective of any JavaScript library to push the web forward? Or should it be to aid development in current browsers regardless of opinion?
jQuery must evolve and that includes supporting new browsers and dropping unused ones. There’s a reasonable argument to abandon IE6 and IE7, but IE8 is the latest version supported on XP and it’s clear many Windows users are lethargic toward upgrading. Personally, I’d recommend sticking with jQuery 1.9 on any site which requires IE6/7/8 support. The risks outweigh the benefits of two code bases.
Time to Upgrade?
Those of a more nervous disposition may prefer to wait a few weeks for any issues to be resolved. You should also note that jQuery 1.9 is unlikely to be a straightforward file replacement and older code may need to be tweaked. That said, the Migrate Plugin offers a great interim solution should you experience problems.
Despite a few reservations about its future, jQuery remains the JavaScript library of choice for me and the majority of web developers.
Craig is a freelance UK web consultant who built his first page for IE2.0 in 1995. Since that time he's been advocating standards, accessibility, and best-practice HTML5 techniques. He's created enterprise specifications, websites and online applications for companies and organisations including the UK Parliament, the European Parliament, the Department of Energy & Climate Change, Microsoft, and more. He's written more than 1,000 articles for SitePoint and you can find him @craigbuckler.