I just asked this question at SO about some bugginess I am experiencing with jQuery and IE8, and someone commented that he was appalled that I would mix JavaScript with jQuery (he has since deleted his comment for some reason).
This person had a high reputation, relative to mine (3000+), so I don't want to ignore his criticism. I'm still relatively new to web development, and I mostly work alone, so I wasn't aware that this could be a problem. Why should mixing the two be avoided?
The issue, and likely, the reason for the comment, seems to be the lines with document.getElementById('firstName');. jQuery can do the exact same thing, and it's generally "safer", since it handles differences between browsers nicely.
The best rule of thumb to follow is use jQuery a DOM manipulation library of your choice (for many people, this is jQuery) to manipulate the DOM, and javascript for everything else you need to do.
<cross browser manipulation of choice>. And I can defiantly say jQuery is not that one for me, however on the grand scheme of things, it's not that badPeople like being black and white.
If you're going to use a cross browser normalization tool then use it. Don't use it to normalize some things but not others.
Example
var a = $("#foo"); var b = document.getElementById("bar"); Those two should not be mixed. Either you use jQuery for edge case bugs you might care about or you use the DOM for speed, but not both.
And yes personally I would also say:
WTF, write your code more coherently, why are you mixing DOM calls with jQuery calls.
As a side-note, you can assume that when he says "javascript and jQuery" he means "calls to the DOM API directly in javascript and calls to the DOM API through the jQuery abstraction layer". Any other comment would be misinformation / trolls.
getElementById.CommentedNov 9, 2011 at 3:06Not sure where such criticism would come from, seeing as jQuery is javascript.
The comment seems to have been deleted, so it is difficult to say exactly what the criticism was about. Could be more about your usage of jQuery or javascript.
Some programmers tends to think in terms of what a tutorial or some programmer guru states.
Most probably, it would be easier to have the same framework used in your application to make the code easier to read and to understand.
But most of the times, frameworks have limitations or bugs so you can never apply what the tutorial or some programmer guru states.
I guess the most important is to satisfy the customer and to ship a bug free application
First of all, it's not jQuery vs. JavaScript. It's jQuery vs the DOM API as-is which is crufty and ugly and kind of obtuse but traditionally most-importantly, unevenly supported in a big way in Microsoft browsers before IE9. But it's all JavaScript. If you're thinking about it any other way you need to lift open the hood and learn what JQ's internals are actually doing.
And no I honestly don't see what the problem with using both is. If you're mucking with the DOM you should know the DOM. One of the things I like about jQuery is that it gets the hell out of my way. Why should I fire a method to get a property I know is available in all browsers when I can just reference it via [0].someProperty instead for instance? Using both shouldn't make it harder for another UI dev to tweak your stuff if jQuery is in the mix because it's never going to have a problem with you doing that. At any time you can wrap any dom collection or object in a $ produced object wrapper by just tossing it in as an argument of the $ function and you're back in jQuery-land so it's not like you've made your code harder for somebody else to modify because that person was less comfortable with the native API.
But they should be able to read plain vanilla DOM API stuff if it's their business to tweak things at that level, regardless of their comfort-level using it. That's just the threshold of technical literacy for a proper entry-level UI-dev as far as I'm concerned. Generally speaking, of course, it can make code more legible to be consistent in the things that you do, but when you feel there's a sensible reason to go one way or the other, there's no reason not to. The key to making that decision is to know a lot about both.
In the scenario where somebody is really freaked out when they see a mix of things happening both the JQ way and the DOM API way, that's often a server-side dev not wanting to wade through stuff they don't really understand in order to re-use your code when you get smacked by the prodigal programmer-murdering bus. In that scenario, they shouldn't even be looking at this stuff in order to understand how to re-use your code for implementation on other pages or to set some alternate behavior. They should be looking at generic JavaScript objects, methods, and factories that expose a consistent/easily-documented API of your own for doing things like sticking a bunch of UI widgets of a given type on a page or setting all the combo boxes in a table to stop doing the auto-filtering thing when you type. All the DOM stuff should be buried and hidden from people who don't need to know it.
And that shouldn't be hard for you to do if ultimately it's all just JavaScript to you.
I prefer to mix them. I usually start off with using strictly (or mostly) jQuery. Since things can get quite CPU intensive with projects I work on that involve possibly 100's of widgets. I find that writing in jQuery is a great start, but when I want to start optimizing my products, I switch a lot of what I can to JavaScript. jQuery is great, but obviously running the native code is faster in most cases.
