It’s often much more efficient to access DOM properties directly , rather than using jQuery. The downside to that approach is that there are differences between the various browsers, so in some cases it introduces bigger problems than the extra performance overhead.
All posts in JavaScript
Dave Ward wrote an article Don’t let jQuery’s $(document).ready() slow you down that shows a few situations where execute the contents of a JavaScript file immediately, rather than wrapping it all inside jQuery( document ).ready(). The .live() method has been deprecated since he wrote the article, though; .on() is its replacement.
Rob Tarr ran some benchmarks to prove the claim that chaining jQuery selector methods is faster than placing them all in a single method call.
This Fiddle shows how to pass extra parameters to an event handler function in jQuery.
WebMonkey has a good article explaining why hash-bang URLS are a bad idea . If you’re not familiar with them, they have #! symbols at the beginning of the path, e.g. http://twitter.com/#!/username. They rely entirely on JavaScript to parse and therefore make the site inaccessible to browsers without JavaScript (or those with it turned off by the user), assistive technologies that people with disabilities use, and… [more]
I wrote earlier about why it’s wrong for websites to force links to open in a new tab or window , but it’ll probably be at least a few years before the majority of clients and web developers finally come around. In the mean time it’d be nice for users to have a way to prevent their browsers from implementing the practice, but surprisingly there aren’t any Chrome extensions. You… [more]
On its own wp_localize_script() can’t handle multi-dimensional arrays, but you can get around that by encoding the child arrays in JSON . That doesn’t handle HTML content very well, though, so another way to do it is to use the l10n_print_after parameter . That’s kind of ugly, but it seems like the best way available right now. It looks like WordPress 3.3 might have a wp_add_js_data() function , which would be much… [more]
I’m writing a WordPress plugin that uses AJAX and I had everything setup and working fine for awhile. I came back to the code a few hours later and all of the sudden I was getting a failed response, even though the code hadn’t changed. I got the correct JSON response when I loaded the… [more]
There’s a bug in jQuery 1.4.3 that causes document.ready() to fire twice if there’s an unhanded exception. You can avoid it by wrapping the code that is throwing the exception inside a try/catch block.
JavaScript doesn’t support true associative arrays, but because data types are defined as objects, the common syntax works. This is a bad practice , though. You should just create a new object.
If you’re performing a JavaScript animation effect on an element (e.g., jQuery’s fadeIn/fadeOut), you may notice that the text briefly pixelates in IE . You can fix that by setting a background color on the element.
Browsers prevent standard AJAX calls across domains for security reasons, but you can make JSONP calls instead. If you’re using jQuery you just need to add ‘callback=?’ to the url: Then setup the request handler to prepend the callback parameter to the response and wrap it in quotes: If you’re using Firebug to monitor the… [more]
The Lightbox Clones Matrix is a list of scripts that do inline popups, ala Lightbox. You can filter by JavaScript frameworks and features.
UPDATE: Now that all modern browsers (that is, everything except IE8 and older) have support for multiple background images via CSS3 , that is my preferred method. It’s detailed by Jeff Starr in his post, Better Image Preloading with CSS3 . * * * * I’ve been looking for a good way to preload images for rollovers, but it seems like a lot of the common methods… [more]
Mark Wilton-Jones has a good overview of the most common methods passing arguments to an event handler in JavaScript. This page has a function (addevent2()) that worked for me.
Stephen Stchur has written a script to mimic IE’s proprietary mouseenter and mouseleave Javascript events for non-IE browsers . This is useful when you have one element (B) laying on top of another element (A), and you want to do a mouseover/mouseout on A without the mouseout firing when you hover on B. Quirksmode has articles on JavaScript mouse events and event bubbling that give good background information. Update: MooTools has… [more]
