It’s been a while since I actually encountered this particular nugget of advice1, but I thought I’d go ahead and make a quick post out of it anyway.
This is the kind of totally random and arbitrary development structure Wordpress has adopted that doesn’t really seem to ever be documented anywhere. If you don’t already know this kind of thing, you could very well be in store for major development and debugging headaches.
Anyway, here we go… If you’re using the built-in jQuery Javascript library that’s included in Wordpress since version 2.2, don’t use the handy-dandy $() function. In Wordpress, $() is reserved for the Prototype library, which is also bundled2.
Instead, for interoperability, be sure to use jQuery() instead, which should accomplish the same thing.
A bad example:
[sourcecode language=”javascript”]
var username = $(‘#username’).val();
[/sourcecode]
If Prototype were to be loaded on the page this snippet of JS is running on, it would throw an error, since it uses a different pattern for selecting DOM elements.
A good example:
[sourcecode language=”javascript”]
var username = jQuery(‘#username’).val();
[/sourcecode]
This line should work on any page, regardless of library conflicts. It’s a couple extra characters to type, but in the end it’s really for the best - you get portability, and it’s more self-explanatory which library is being used when you go back to look at this code in 6 months.
I’m planning another, similar, Javascript-related post as soon as I get a few more minutes to make it coherent. Stay tuned, and happy coding!
Wow! Thank you so much. I am just diving into javascript and was beginning to lose hope. How is this not widely documented? I will definitely be blogging about it when my site is done.
Thanks!!
Thanks very much for this post. It just saved my sanity. Please consider writing an article for the WP Codex.
Tnx 10000000000000000x!!! This post is a big time saver!
You save my day, I spend some time looking for this solution.
Thank You,
Carlos
Hello, this is definitely the right advice. I also stumbled across it on the internet at random. It’s definitely true that people are spending more time coding the stuff than documenting it, but that’s a well-known struggle.
The next problem we’ll all likely encounter is getting jQuery plugins to work with our WordPress installation of jQuery.
According to various sources (I haven’t seen it in the docs yet..).. Using a plugin file is as easy as including its js file after the main jquery script initialization (ie in the head of your document)..
Unfortunately I have tried doing this with the cycle plugin (http://malsup.com/jquery/cycle/) and nothing. Although jQuery is alive and well, the cycle plugin is not being registered.
Any help at all would be well appreciated!
This worked great for me, thanks for the advice. There’s a few other methods I couldn’t seem to get to work.