Reputation: 7567
I do a:
console.log($('#test'));
I know that test doesn't exist. If I do a console.log, it doesn't output undefined/null. Rather it ouputs something like an empty array and when I check that array it looks like it returns the jQuery object itself.
I also tried:
if ($('#test')){
//do something
}
But it still doesn't work. I want to know whether the ID I am selecting exists on page or not. How do I do that using jQuery?
Upvotes: 0
Views: 228
Reputation: 9131
best way for this is to check length of the selected element
if ($('#test').length > 0){
//do something
}
But if you want to create a exist function jQuery welcomes you just add the line in your script
jQuery.fn.exists = function(){return this.length>0;}
and now you can Check if element exist or not
if ($(selector).exists()) {
// Do something
}
Upvotes: 1
Reputation: 708206
It's something like 20x faster to do this:
if (document.getElementById("test"))
compared to the jQuery operation to just determine if a DOM object with that id exists in the page. jQuery can do a lot for you, but when its general selector engine and general object structure isn't needed, it's not the quickest way to do things.
As others have said, $("#test")
is always a valid jQuery object, even if #test
doesn't exist. If the #test
object doesn't exist, then $("#test")
will be a jQuery object that has no DOM objects in it (the internal array will have a .length === 0
), but it's still a valid object.
Upvotes: 4
Reputation: 1906
console.log($('#test'));
This won't print the value because it represents the object found in the DOM with the id test. If you want to get values, use $("#test").val(); or $("#test").html();
If you want to check existence, do the length test as suggested above.
Also, if you're testing for the existence of a generated element (something you added to the DOM), make sure you checkout .live (http://api.jquery.com/live/). This is need for all elements that are created after the page is loaded.
Upvotes: 0
Reputation: 97727
Use
if ($('#test').length > 0){
//do something
}
the length tells you how many items were selected if it is 0 no element has the id test.
Upvotes: 1
Reputation: 490667
In JavaScript, objects are always truthy, so using it in that fashion will always pass the condition.
You need to check the length
property. A response of 0
is falsy, and will work as expected.
if ($('#test').length) {
// ...
}
This is unlike document.getElementById()
, which returns null
if the element with that id
attribute does not exist.
If this is confusing, you could always write a quick jQuery plugin.
$.fn.exists = function() {
return !!this.length;
};
You can then call exists()
on a jQuery collection, to ensure that selector has matched at least one item.
Upvotes: 1
Reputation: 7663
use something like this
if ($('#test').length > 0){
alert('hi')
}else
{
alert('hello')
}
Upvotes: 1
Reputation: 9691
Use '(' and ')' for 'if' statements, and check if the returned array has length greater than 0:
if ($('#test').length > 0){
//do something
}
Upvotes: 1