We still have 7 more days of jQuery 1.4 to come with more video’s and more releases to announce.
Again, events like these are not possible without support from our great sponsors and from you, the jQuery Community. We’d like to thank everyone who has donated so far, and we’d like to remind everyone that you will receive a free ebook with the donation of $20 or more throughout the 14 Days of jQuery.
Media Template Giveaway
Each day during the 14 days of jQuery, a web developer will receive a free (gs) Grid-Service account for one year from the jQuery Project’s web hosting provider, Media Temple. A grand prize winner will receive a 13″ MacBook Pro!
In order to enter the contest, you must submit a link to your coolest use of jQuery. A winner will be chosen each day during the 14 Days of jQuery. The grand prize winner will be announced on Friday, January 29th.
Check the Media Template Giveaway webpage for more details about the contest and to see the announced daily winners. There are only 7 days left, so enter now!
Check out jQuery Enlightenment!
jQuery team member Cody Lindley has published the jQuery Enlightenment book, and if you haven’t checked it out yet, you’ll definitely want to. “Each chapter contains concepts essential to becoming a seasoned jQuery developer,”‘” so even if you’ve already got your copy, pick one up for a friend who’s just learning! Even better, a percentage of all sales goes directly back to the jQuery project and helps fund future releases and projects. A big thank you to Cody for his generous donation for the 14 Days of jQuery campaign!
In celebration of jQuery’s 4th birthday, the jQuery team is pleased to release the latest major release of the jQuery JavaScript library! A lot of coding, testing, and documenting has gone into this release, and we’re really quite proud of it.
I want to personally thank Brandon Aaron, Ben Alman, Louis-Rémi Babe, Ariel Flesler, Paul Irish, Robert Katić, Yehuda Katz, Dave Methvin, Justin Meyer, Karl Swedberg, and Aaron Quint who put a lot of work into fixing bugs and getting the release out the door.
Downloading
As usual, we provide two copies of jQuery, one minified (we now use the Google Closure Compiler as the default minifier) and one uncompressed (for debugging or reading).
Additionally, Google has provided us with a copy of jQuery hosted on their servers. This copy of jQuery is automatically minified and gzipped – and served from Google’s fast edge cache servers.
You can feel free to include the above URL directly into your site and you will get the full performance benefits of a quickly-loading jQuery.
With jQuery 1.4 we attempted to minimize any large upgrade hassles – maintaining the signatures of all public functions. That being said, please read through the list of potentially-breaking changes to be aware of what might cause problems in your applications.
Features
Below is an overview of all the changes and functionality added to jQuery 1.4. Additionally all of the changes have been documented in the jQuery 1.4 docs.
Performance Overhaul of Popular Methods
Many of the most popular and commonly used jQuery methods have seen a significant rewrite in jQuery 1.4. When analyzing the code base we found that we were able to make some significant performance gains by comparing jQuery against itself: Seeing how many internal function calls were being made and to work to reduce the complexity of the code base.
// find all ampersands in A's and wrap with a span
$('a').html(function(i,html){
return html.replace(/&/gi,'<span class="amp">&</span>');
});
// Add some information to the title of the anchors
$('a[target]').attr("title", function(i,title){
return title + " (Opens in External Window)";
});
jQuery 1.4 adds support for nested param serialization in jQuery.param, using the approach popularized by PHP, and supported by Ruby on Rails. For instance, {foo: ["bar", "baz"]} will be serialized as “foo[]=bar&foo[]=baz”.
In jQuery 1.3, {foo: ["bar", "baz"]} was serialized as “foo=bar&foo=baz”. However, there was no way to encode a single-element Array using this approach. If you need the old behavior, you can turn it back on by setting the traditional Ajax setting (globally via jQuery.ajaxSettings.traditional or on a case-by-case basis via the traditional flag).
There are three ways to enable the traditional way of serialization:
// Enables for all serialization
jQuery.ajaxSettings.traditional = true;
// Enables for a single serialization
jQuery.param( stuff, true );
// Enables for a single Ajax requeset
$.ajax({ data: stuff, traditional: true });
If the response to an Ajax request is returned with a JSON mime type (application/json), the dataType defaults to “json” (if no dataType is specified). Additionally, if the response to an Ajax request is returned with a JavaScript mime type (text/javascript or application/x-javascript) , the dataType defaults to “script” (if no dataType is specified), causing the script to automatically execute.
By default, jQuery ignores the Last-Modified header for Ajax requests, preferring to make request and ignore the browser cache. Specifying ifModified: true causes jQuery to use the browser cache if available. jQuery 1.4 will also send the If-None-Match header (for ETag support) if you specify ifModified.
jQuery 1.3 and earlier used JavaScript’s eval to evaluate incoming JSON. jQuery 1.4 uses the native JSON parser if available. It also validates incoming JSON for validity, so malformed JSON (for instance {foo: "bar"}) will be rejected by jQuery in jQuery.getJSON and when specifying “json” as the dataType of an Ajax request.
You can now specify a context for an Ajax request, and all callbacks will have that context set (allowing you to simplify your code and possibly avoid having to use closures, or use other objects).
The success callback for any ajax request now receives the XMLHttpRequest object as the third argument. Previously this XHR object was only accessible as the return value for $.ajax and the like.
In jQuery 1.3, the contentType setting was ignored in jQuery.ajax if no data was sent. In jQuery 1.4, the contentType is always sent. This fixes an issue with some backends that used the Content-Type header to decide what kind of response to send.
You can now pass in negative numbers for .get() and .eq(). For example, you can select the second-to-last div or, you can access the DOM element for the same:
.get() has historically returned an Array from the jQuery set. For further clarity, you can use .toArray() to achieve the same thing in jQuery 1.4. Unlike, .get(), however, .toArray() does not take an argument.
In jQuery 1.3, jQuery() returned a jQuery set containing just the document. in jQuery 1.4, it returns an empty jQuery set. This can be useful for creating an empty set and adding elements to it dynamically. Note: The jQuery().ready() technique still works in 1.4 but it has been deprecated. Please use either jQuery(document).ready() or jQuery(function(){}).
All three now use the same code path (using document.createElement), improving performance for jQuery("<div></div>"). Note that if you specify attributes, we use the browser’s native parsing (using innerHTML).
CSS
The performance of the .css() method has seen a 2x performance improvement.
The performance of the .addClass(), .removeClass(), and .hasClass() methods has seen a 3x performance improvement.
It is sometimes desirable to work with the data attached to an element as a complete object. A common example would be wanting to copy the entire data from one element to another. In jQuery 1.4, .data() with no parameter returns the entire object, and .data(Object) sets the object. Keep in mind that this object includes events bound to the element, so use caution.
jQuery uses a unique expando on DOM elements that is used to get the .data() for a particular element. jQuery now avoids creating that expando when data is looked up but no data has been added. This potentially increases performance and avoids polluting the DOM in these cases.
In addition to being able to specify an easing function for an animation you can now specify an easing animation for individual properties. James Padolsey has more information and demos in his blog post.
If you want to ensure that “this” inside a function will be permanently bound to a particular value, you can use jQuery.proxy to return a new function with that scope.
The change and submit events work reliably across browsers for both normal and live events. We override the normal change and submit events in Internet Explorer and replace them with events that work identically to the other browsers.
focusin and focusout are generally equivalent to focus and blur but bubble, which helps tremendously if you are writing your own event delegation behavior. Please note that `focus` and `blur` will not work with the live() method; this was a design decision due to the DOM Events spec defining focus/blur do not bubble.
$("form").focusout(function(event) { var tgt = event.target; if (tgt.nodeName == "INPUT" && !tgt.value) { $(tgt).after("<span>nothing here</span>"); } });
With the exception of ready, focus (use focusin instead), and blur (use focusout instead), all events that can be bound using .bind() can also be live events.
We’re very proud to count some addtional events amongst those supported by live(). 1.4 introduces cross-browser support for change, submit, focusin, focusout, mouseenter, and mouseleave via the event delegation in .live().
Note that if you need a live focus event, you should use focusin and focusout rather than focus and blur, because, as mentioned, focus and blur do not bubble.
Also, live() also now accepts a data object, just as bind() has. (Commit)
You can now specify a context to the selector that will be used to bind a live event. If you do, only elements under that context will be bound. While the elements themselves do not need to exist when you create the live event, the context must exist.
detach() removes an element from the DOM but does not remove the associated event handlers. This is appropriate for temporarily removing an element to manipulate and then return.
var foo = $("#foo").click(function() { // do something }); foo.detach(); // foo retains event handlers foo.appendTo("body");
jQuery caches the resulting nodes created using methods like jQuery("<div>") and .after("<div>"). This results in significantly faster performance on pages that do DOM manipulation with strings using these methods.
before, after, replaceWith on disconnected nodes (commit)
You can now use before, after, and replaceWith on nodes that are not attached to the DOM. This allows you to do more complex manipulations before inserting the final structure into the DOM. This also prevents reflows from occuring while the manipulation is taking place.
In jQuery 1.3, .clone(true) did a deep clone, but did not clone data. In jQuery 1.4, it clones data, which means that events are cloned as well. This uses the same semantics as jQuery.extend, so plain objects and Arrays are cloned, while custom objects are not.
The .delay() method will delay any further elements in the queue for the specified number of milliseconds. By default, it will use the fx queue. You can specify an alternate queue as an optional second parameter to the delay function.
In jQuery 1.4 the function that’s called is passed in another function, as the first argument, that when called automatically dequeues the next item and keeps the queue moving.
Queues can now be cleared. This will remove any unexecuted functions from the queue, but not stop running functions. Using .clearQueue() without any parameters will clear the fx queue.
The new “until” methods function similarly to .nextAll(), .prevAll(), .parents(), but the first argument they take is a selector that will terminate the traversal.
The .add() now accepts a context. This is primarily useful in a chain when you want to add in addtional elements (returned from an ajax request, for example) and then manipulate those in addition to the others.
The closest method can now accept a context DOMElement as a second argument. Passing in a context will typically make your closest() calls much faster. This also applies to live() which leverages closest() internally.
This returns true if there are not any properties on the object. You can only pass in objects to jQuery.isEmptyObject(), because jQuery performs an iteration on the object that is passed in without any other checks.
In jQuery 1.4, the jQuery.unique() method, which is used internally in the creation of the jQuery set, always returns results in document order. This means that jQuery sets returned from jQuery functions should be returned in document order.
For compliance with Caja and because it is slated to be deprecated in the upcoming ECMAScript 5 specification, we have removed all references to arguments.callee in jQuery core.
Now use Closure Compiler instead of YUI Min (commit)
Internal Reorganization
One of the major pushes that we made with 1.4 was towards building a more legible, understandable, code base. To achieve that we did some major restructuring of the of the code base internals and began to establish some style guidelines for the code base.
Some of the major changes that were made:
The old ‘core.js’ file has been split apart into ‘attribute.js’, ‘css.js’, ‘data.js’, ‘manipulation.js’, ‘traversing.js’, and ‘queue.js’.
The ready event has been moved into core.js (as it’s a fundamental part of jQuery itself).
The logic for css and attributes have been split and aren’t so intertwined anymore.
Testing
In jQuery 1.4 we’ve fixed 207 bugs (compared to 97 bugs in the 1.3 release).
Additionally we’ve increased our test coverage from 1504 tests in jQuery 1.3.2 to 3060 tests in jQuery 1.4.
The jQuery test suite is 100% passing in all the major browsers (Safari 3.2, Safari 4, Firefox 2, Firefox 3, Firefox 3.5, IE 6, IE 7, IE 8, Opera 10.10, and Chrome).
Backwards-Incompatible Changes
With jQuery 1.4 we attempted to minimize any large upgrade hassles – maintaining the signatures of all public functions. That being said, please read through the following list to be aware of what might cause problems in your applications.
.add() no longer plainly concatenates the results together, the results are merged and then sorted in document order.
.clone(true) now copies events AND data instead of just events.
jQuery.data(elem) no longer returns an id, it returns the element’s object cache instead.
We are now strict about incoming JSON and throw an exception if we get malformed JSON. If you need to be able to evaluate malformed JSON that is valid JavaScript, you can make a text request and use eval() to evaluate the contents.
Param serialization now happens in the PHP/Rails style by default. You can use jQuery.ajaxSettings.traditional = true; to use traditional parameter serialization. You can also set the behavior on a per-request basis by passing traditional: true to the jQuery.ajax method.
If an Ajax request is made without specifying a dataType and it is returned as text/javascript, it will be executed. Previously, an explicit dataType was required.
Setting an Ajax request’s ifModified now takes ETags into consideration.
We’ve also written a plugin that provides backwards compatibility with every potentially-breaking change that we’ve made in 1.4. Feel free to download and include this plugin, after you’ve included 1.4, if you have any issues upgrading to 1.4.
In anticipation of next week’s jQuery 1.4 release we’re revealing the brand new jQuery API site. Not only is this a complete redesign of the existing API site but it’s also a complete rewrite. Every single method has been rewritten from the bottom-up to provide the best possible information about how jQuery works.
API Documentation Rewrite
A couple months ago the jQuery team sat down to start rewriting the API documentation in anticipation for the 1.4 release. We were working with team member Karl Swedberg, one of the co-authors of Learning jQuery and the jQuery Reference Guide, and in reviewing his work on the next version of the jQuery Reference Guide came to the conclusion that he had written a superior resource. We contacted Packt publishing and came to agreement wherein the project would receive the contents of the jQuery Reference Guide so that we could use it and publish it on the API site as we see fit.
This is a huge coup for the jQuery community: I think you’ll find, when looking at the improved documentation, that the quality is dramatically improved over the old docs. There are more explanations, more examples, and the documentation has been made current with jQuery 1.4 wherever possible (there are still some gaps that we’re looking to close before the release but we’re very nearly there).
The new version of the jQuery Reference Guide, based upon this rewrite of the jQuery API, is coming out soon. I recommend watching the Packt publishing web site for more announcements.
We should mention that we’re working on a final set of licensing for the site’s contents. Once the final ducks are in a row we’ll be releasing the entire contents of the site under a Creative Commons license for all to use as they see fit.
API Site Redesign
The entire API site has been redesigned. We’ve taken special care to try and integrate many of the requests that’ve come in from users to improve the overall quality of the site.
API Home Page
To start you’ll notice that the API now has a dedicated sub-domain focusing completely on jQuery API: https://api.jquery.com/
(Note: The old docs.jquery.com API pages will remain intact for about a week or so, so that we can make sure that everything is transitioned over, then we’ll set up the final redirects to the new site.)
This main landing page is optimized to get you to the methods that you want, as quickly as possible. The main page has every single jQuery method, property, and selector listed on it – you can scroll through the full list, or browse through the extensive category list on the side, or you can simply begin typing. When you type on the jQuery API homepage all the API entries will be instantly filtered.
Categories and Versions
One of the areas that we wanted to see improved in this iteration of the site was the quality of categories provided. To start, we’ve expanded the number of categories from our traditional jQuery module structure to become more comprehensive (and include topics like forms and plugin authoring). Along with this expansion we made it so that API entries could co-exist in multiple categories simultaneously. This will make it easier for you to find the entries you’re expecting, where they should be.
Additionally, and perhaps more importantly, we’ve added information to every single method, property, and selector in the API showing in which version they were added to jQuery. For example, you can see all the pieces of the API that were added, or changed, in jQuery 1.4 (Note: The aforementioned page is nearly complete, it’ll be more-so in time for the final 1.4 release next week). We have version information for every entry, going all the way back to jQuery 1.0.
API Entries
Individual API entries are not only easier to read but they’re also easier to find. You no longer have to divine which category an API entry might be in: You can simply access the name directly. For example:
When viewing an API entry you’ll likely note a few major changes: No more tabs hiding important entry content, clearer page organization, and most excitingly: A new, inline, commenting system.
As part of the move we’re moving away from using a wiki to power the API site. While it was nice to receive the occasional contributions from users those additions were far outweighed by the piles of spam that the wiki got. Now you can feel free to use the inline comment system to talk about the API entry, provide samples, and offer corrections. The jQuery team will be monitoring the comments and will periodically integrate recommended changes.
Performance and Backend
As mentioned before, we’ve switched away from using a MediaWiki backend to a new WordPress-powered backend. So far we’ve been very impressed with the performance. Every single page on the site is heavily cached and gzipped – with all media being served up from our CDN. We think you’ll find it to be a significant performance improvement over the old docs site.
jQuery API XML Dump
A big part of the rewrite of the new backend is that we can now provide a uniform XML dump of the jQuery API. Historically we’ve provided a Python script for scraping the contents of the wiki site but now we’re just going to provide that file directly and immediately to you. If you’re developing a tool that provides alternative views for displaying the documentation you can feel free to use the file as you see fit.
Thanks
I want to thank the whole jQuery team for their support but specifically Karl Swedberg, Jonathan Chaffer, Paul Irish, Boaz Sender, John Resig, Richard Worth, and Scott Jehl for their hard work in rewriting the documentation and making this site come to life. It was many hours of tedious work but we hope all will benefit from it in the end.
Note from 2025: The jquery14.com domain is no longer owned by people behind jQuery. Its posts have been migrated directly to the jQuery blog, any remaining references are replaced with Web Archive links. Other than that, the content is mostly preserved for historical purposes.
It’s the start of a new year, and the jQuery team’s been hard at work. We’ve been up day and night working to crank out the upcoming jQuery 1.4 release, and there’s a LOT to announce! So much, in fact, that we’ll need fourteen full days to get it all out there… As such, I’d like to announce The 14 Days of jQuery 1.4 (archived)!
Beginning on January 14th, we’ll start a fourteen-day event. Each day we’ll have fresh videos and announcements — there’ll be code releases, project-related updates, and jQuery UI goodness, among other things. In addition to the announcements, we’ll also be releasing a set of videos over the 14 days with talks and tutorials relating the jQuery 1.4 release and other general jQuery topics. You’ll want to check back at jQuery14.com (archived) every day during the two weeks to see what’s new, or sign up to be notified via email. Think of it like an online conference, only longer, freer, and with a bit of mystery and suspense!
But Wait, There’s More!
We’ve got a lot planned for January 14th, but it seemed good to whet your appetite and pre-release some tasty jQuery morsels. Head over to jQuery14.com (archived) to learn all about the brand-new jQuery API site:
Be sure to subscribe to the jQuery14.com (archived) site or to the @jquery Twitter account for all the updates during these upcoming weeks.
Free Books, Anyone?
The jQuery project is a non-profit, open-source effort, and we rely heavily on donations and contributions to help fund everything we do. We’ll be running a fundraising drive starting now and throughout the 14 Days of jQuery. If you’re a jQuery user, show your support by making a tax-deductible donation of $20 USD (archived) or more to the project during the event, and you’ll receive a free jQuery book with your donation.