HTML & CSS
Article
By Craig Buckler

What’s New in jQuery 1.6

By Craig Buckler

The web’s most popular JavaScript library has been updated. jQuery 1.6 is now available for download from:

http://code.jquery.com/jquery-1.6.js
http://code.jquery.com/jquery-1.6.min.js

The jQuery team try to maintain compatibility with older releases. However, while most people won’t experience problems, there’s no substitute for rigorous testing. As well as the numerous bug fixes and speed improvements, there are several major changes in the latest release…

CHANGE: Separate Handling of DOM Attributes and Properties

In most cases, JavaScript developers handle DOM node attributes and properties identically. Previous versions of jQuery did not make any distinction but there are a few issues with this approach. Consider:


<input type="checkbox" checked />

In this case, the DOM .checked property is set to true but the attribute value is an empty string. In previous versions of jQuery, .attr(“checked”) would return true — it now returns “”. The new .prop() and .removeProp() methods can be used to modify or remove a DOM property accordingly.

CHANGE: Data Attribute Casing

The .data() method automatically imports HTML5 data attributes, e.g.


<div data-day-now="Monday" />

In jQuery 1.5, this would result in a the data object { day-now: “Monday” }. Version 1.6 follows the W3C HTML5 specification and sets { dayNow: “Monday” }.

NEW: focus selector

It’s now possible to select an element which has focus, e.g.


$("input:focus").addClass("focused");

Note that if you’re searching for the element which currently has focus, $(document.activeElement) is faster and more efficient.

NEW: jQuery.holdReady( hold )

The $.holdReady() method delays jQuery’s ready event. This could be used to dynamically load scripts before ready events are fired, e.g.


$.holdReady(true);
$.getScript("anotherScript.js", function() {
     $.holdReady(false);
	 // ready event can now fire
});
--ADVERTISEMENT--

IMPROVED: Relative CSS

CSS properties can now be modified using relative values, e.g.


// move 10px to the right
$("#item").css("left", "+=10px");

IMPROVED: jQuery.map()

It’s now possible to map the properties of objects as well as array elements, e.g.


var obj = { p1: 1, p2: 2, p3: 3 };
jQuery.map( obj, function( val ) { ... });

IMPROVED: find(), closest() and is()

Traversing and locating nodes in the DOM tree can now be matched against an element as well as a selector string or jQuery object.

On to jQuery 1.7…

The jQuery team are now taking proposals for version 1.7. If you’re desperate for a new or improved feature, please leave your comments on the jQuery 1.7 Roadmap Proposal form.

Recommended
Sponsors
The most important and interesting stories in tech. Straight to your inbox, daily. Get Versioning.
Login or Create Account to Comment
Login Create Account