getElementsByTagName is not a function
Folks, this post has nothing to do with CSS.
My scripting skills are still in the beginner stage. The only JavaScript library I've been using is EJ - Essential JavaScript, which is very small, very readable for a newbie like me, and easy to work with for the very basic DOM manipulation I've worked on in projects. It even uses $('someID') as a document.getElementById replacement so I can use the dollar signs like the big boy libraries.
But when a project demands some special effects (like moo.fx or scriptaculous), I thought I could just pull in my favorite library and slide, grow, shrink, whatever, without any hiccups. Not so. I found jquery, and tried to plug it in and use alongside my existing scripts. That's when I noticed some "getElementsByTagName is not a function" errors.
It turns out that my use of $('someID') was the culprit. jquery's use of the dollar sign is much more involved than EJ's, and it was causing some hiccups. So I changed the EJ "library" to use getId('someID') instead of the $. Now it's still more efficient (at least as far as me typing it out) than using document.getElementById, and I get the benefits of using jquery where I need it, too, with no more conflicts (yet).
As I grow more familiar with jquery, I look forward to making better use of it, and eventually exclusive use of it. In the meantime, I'm attempting to get the best of both worlds - a powerful library that I don't understand vs. a less efficient library that I "get" (no offense to Robert Nyman about the efficiency remark).
This post comes at a time when jquery has just announced a new version (1.1.3), and I am expecting Pro JavaScript Techniques by jquery's author any day now from Amazon. I so look forward to understanding all this.
Comments (7)
ilovenicotine said:
You might want to look at prototype.js. It's has everything I've ever wanted and more. getElementByClassName is one of my favorites. For some reason this obvious method was never written by default. Prototype also does $(element) very well, I've never seen errors like the one you've gotten. The best part of prototype is the AJAX library. I don't know how much you've messed with XMLHTTP request's but with prototype, I was able to get started immediately. After learning a little more I've found that I have full control over my AJAX objects as well (aborting comes in handy!).
Oh, and as the "CSS guy" you'll love the $$('') function. It takes CSS as arguments!!!!! It's awesome.
ie: $$('li.button') would return an array of li tags with the className 'button'
http://www.prototypejs.org/
# July 2, 2007 12:53 PM
Rémi said:
There's a nifty function in jQuery called "noConflict"
You can use it so that jQuery won't use the $ as its main function anymore. Check this example code from jQuery documentation:
jQuery.noConflict(); // Do something with jQuery jQuery("div p").hide(); // Do something with another library's $() $("content").style.display = 'none';# July 2, 2007 2:09 PM
Steve said:
I found learning this stuff from scratch was the best way, rather than using libraries, and HIGHLY recommend Jeremy Keith's DOM Scripting for understanding this kind of thing.
Pro JavaScript is on my shortlist for a follow-up book. Perhaps you might post a review of it when you've had time.
Good luck.
# July 2, 2007 4:14 PM
CSS Guy said:
@ilovenicotine:
Prototype vs jquery - I don't want to argue, but one of these days I look forward to being able to draw a conclusion for myself. :)
@Remi:
Thanks!
@Steve:
I've read DOM Scriping twice, and loved it both times. I learned about Robert Nyman's collection of functions through the DOM Scripting blog. I'm well aware of the warning against libraries for beginners from both Jeremy Kieth and especially from Roger Johansson. But when you need special effects, what's a guy to do? Hopefully the book by John Resig will provide some insight into his way of thinking, and make his library more approachable for me.
# July 2, 2007 5:18 PM
NoWhereMan said:
I like mootools http://mootools.net as library.
As for the how about using $$ instead of $ for the function name? Two keystrokes instead of one, but no conflict may be a good compromise. I don't remember if jQuery has $$() already defined; you may also check stuff like $_ etc.
bye
# July 3, 2007 1:45 PM
Jan (Aysberg) said:
Like you I am no programmer (JavaScript, PHP, etc.) but am beginning to use jQuery on clean XHTML/CSS websites for additional functions.
Great you also went for jQuery and not for the overblown prototype. Looking forward for upcoming articles about CSS and jQuery!
# July 4, 2007 2:04 AM
Jon said:
got it
# July 23, 2007 10:32 AM