EDIT:
Its a pitty to see that people do not want to learn what is the better approach from the three diffrent methods, this question is not actually on "How to check if a div exists",
But, its about which method is better, and if someone could explain, then also why.

@Dementic, yeah sure - but it's very similar - and if that top answer would be wrong, I guess one of the 73,694 pair of eyes might have spotted an error already.
–
mikuAug 1 '11 at 13:43

1

@Miku - in that case, lets close the site, since all lines of code are similar... :P
–
DementicAug 1 '11 at 13:45

1

@Dementic: It should show you that the third method still tells you that the element exist although it does not. What do you conclude from this? That you cannot test for existence of an element with the third method.
–
Felix KlingAug 1 '11 at 14:17

3 Answers
3

The first is the most concise, I would go with that. The first two are the same, but the first is just that little bit shorter, so you'll save on bytes. The third is plain wrong, because that condition will always evaluate true because the object will never be null or falsy for that matter.

"The first is the most concise, I would go with that.{...}, so you'll save on bytes", very bad mindset. Maintainable code > concise code.
–
Niklas EkmanNov 16 '13 at 18:30

1

@NiklasEkman - I agree that maintainability is more important than precise code, yet I was not generalising. I guess I was not being clear enough. In the case of testing the length of a collection, for positive non-zero it seems to me that .length defeats .length > 0, so it's kind of a double-win. Still, thanks for pointing this out.
–
karim79Nov 27 '13 at 23:44

$(document).ready(function() {
var $myDiv = $('#DivID');
if ( $myDiv.length){
//you can now reuse $myDiv here, without having to select it again.
}
});

A selector always returns a jQuery object, so there shouldn't be a need to check against null (I'd be interested if there is an edge case where you need to check for null - but I don't think there is).

If the selector doesn't find anything then length === 0 which is "falsy" (when converted to bool its false). So if it finds something then it should be "truthy" - so you don't need to check for > 0. Just for it's "truthyness"

If you're using jQuery I don't see any reason to use getElementById, unless you really need the performance improvement (e.g. it's in a long loop or something, though I can't think of how this would come up, that you need to run thousands of select queries over and over). It's just much more verbose, over the course of a lot of javascript that really adds up to more space and less readability.
–
Jamie TreworgyAug 1 '11 at 14:09

True, I agree with your point @jamietre I mainly use the jQuery version, as I'm probably using the jq object elsewhere. However if you know you always going to use an ID parameter and all your doing is checking for existance of an element, having the jQuery object isn't helping much (as it's just wrapping around getElementById). I suppose the other performance benifit (if checking existance is the only need for jq - probably pretty rare) is not even needing to download the library at all. Your right, getElementById most of the time is unecessarily verbose, but it's good to know an alternative.
–
Alex KeyAug 1 '11 at 15:45

That's true @Piero I agree. "document.queryselectorAll()" caniuse.com/querySelector allows you to use classnames etc, but it won't for older browsers. jQuery abstracts that so you don't need to worry about it (and in fact uses queryselectorAll in the background if available).
–
Alex KeyNov 8 '13 at 9:16

As karim79 mentioned, the first is the most concise. However I could argue that the second is more understandable as it is not obvious/known to some Javascript/jQuery programmers that non-zero/false values are evaluated to true in if-statements. And because of that, the third method is incorrect.

I would argue that most JavaScript developers would know that a non-zero, positive integer is considered "truthy", but that's just my point of view :)
–
karim79Aug 1 '11 at 13:52

2

I would argue that ALL Javascript developers should know that. But nowadays so many people develop almost exclusively in "jQuery" and lack basic Javascript fundamentals. But that's a whole different discussion :P
–
tskuzzyAug 1 '11 at 13:55

1

Disagree. Testing for truthiness is pretty fundamental javascript. While it may look funny if you're more familiar with another language that doesn't have this concept, it's extremely common and once you're used to it improves readability.
–
Jamie TreworgyAug 1 '11 at 13:58