MSDN Magazine - March 2009 - (Page 21) DINO ESPOSITO CUTTING EDGE Explore Rich Client Scripting With jQuery, Part 1 You know how it is. The more functionality you want to squeeze out of the Web browser, the more you have to write in JavaScript. Introduced around to add more action to HTML pages, the JavaScript language was not expressly designed for developers. It was actually designed to manipulate HTML elements, set styles, and react to user input. It has also been widely used for client-side input validation and other lightweight operations. Seeing the somewhat trivial uses JavaScript has been applied to might lead you to believe that it is simple to write. But as Ray Djajadinata pointed out in “Create Advanced Web Applications with Object-Oriented Techniques” in the May issue of MSDN Magazine (see msdn.microsoft.com/magazine/ cc163419), writing good JavaScript code is not trivial but if you understand it well, you can indeed squeeze some rather advanced functionality out of it. One of the drawbacks of JavaScript, though, is that it’s an interpreted (not compiled) language and thus is subject to the browser’s, well, interpretation. Not all browsers process the same JavaScript code in the same way. But libraries like jQuery can make your JavaScript code more predictable across browsers. Microsoft now fully supports jQuery and distributes it with the ASP.NET Model-View Controller (MVC) framework. Furthermore, extensions have been developed to fully integrate jQuery IntelliSense in Visual Studio SP. In this month’s installment, I’ll discuss the main characteristics of the jQuery library and focus in particular on CSS selectors, function chaining, and wrapped sets. In a future installment, I’ll look at more specific topics such as using jQuery to handle events and effects, browser-side caching and AJAX requests. One of the drawbacks of JavaScript is that it’s an interpreted language. jQuery can make it more predictable. offers three versions of the library: uncompressed, packed and minimized. The uncompressed version is close to KB and is fully human readable and commented. This version is definitely the one to pick up for perusal and debugging. The minimized version is about KB. All extra characters that are not strictly required to implement the functionality have been removed from the source code. The code is impractical if not impossible to read for humans, but it works just fine for computers. Finally, the packed version is barely KB in size, but it requires more initialization time on the client. The jQuery official site recommends you consider getting the minimized version instead of the packed version for production environments. In addition, you should consider that GZip compression over the wire is standard practice and is handled by all modern Web servers and browsers. GZip compression brings the size down to about KB. If you use GZip, the packed version is pretty much useless. In an ASP.NET project, you also need a jquery-..-vsdoc.js in order to enable IntelliSense and a Visual Studio patch (code.msdn.microsoft.com/KB958502) in order to fully support jQuery IntelliSense. In ASP.NET, you can either use a plain tag to link the library or you can list it in the Scripts section of the ScriptManager control, like so: jQuery at a Glance jQuery makes JavaScript code easier and quicker to write. The library provides helper functions that dramatically increase your productivity while decreasing your frustration. The resulting code is easier to read and more robust because the higher level of abstraction hides a number of checks and error handling procedures. The library, written by John Resig, consists of a single .js file you can download from docs.jquery.com/Downloading_jQuery. The latest version is .. which was released in the Spring of . The download site Note that this approach is not recommended with the current version of ASP.NET unless you also want the Microsoft AJAX library embedded in the page. In ASP.NET ., it will be possible to disable the inclusion of the Microsoft AJAX client framework files, thus making this approach a good one. The whole set of jQuery functionality can be divided into four main areas: DOM query and manipulation, effects and animation, Send your questions and comments for Dino to cutting@microsoft.com. March 2009 21 http://msdn.microsoft.com/magazine/cc163419 http://msdn.microsoft.com/magazine/cc163419 http://code.msdn.microsoft.com/KB958502 http://docs.jquery.com/Downloading_jQuery
For optimal viewing of this digital publication, please enable JavaScript and then refresh the page. If you would like to try to load the digital publication without using Flash Player detection, please click here.