I'm working on creating a more semantic way of checking for elements with jQuery. Using $("#element").length > 0
just doesn't really feel very well worded to me, so I'm making my own selector addition for use in .is
:
if($("#element").is(":present")) {
console.log("It's aliiiveeee!!");
}
That part was easy, like this:
$.extend($.expr[':'],{
present: function(a) {
return $(a).length > 0;
}
});
I want to go a step further, and make it easy to see if an element doesn't exist, using similar syntax:
$.extend($.expr[':'],{
present: function(a) {
return $(a).length > 0;
},
absent: function(a) {
return $(a).length === 0;
}
});
$(function() {
if($("#element").is(":absent")) {
console.log("He's dead, Jim.");
}
});
But this part is surprisingly hard to do. I think it's because I'm paring down the returned elements to get a result, and paring the selector to .length === 0 is the same as asking for no elelements: it returns false no matter what.
I've tried a lot of different ways to reverse things and get this to return true when the element doesn't exist, and false if it does:
return $(a).length === 0;
return !($(a).length > 0);
if(!($(a).length > 0)) {
return true;
}
if($(a).length > 0) {
return false;
} else {
return true;
}
return !!($(a).length === 0);
// etc...
Is there an easy way to get this to just return true if the element doesn't exist, and false if it does?
This method can be used on this element to test if it is empty by using “:empty” selector. The “:empty” selector is used to select all the elements that have no children. It will return true if the element is empty, otherwise, return false.
We can use jQuery's isEmptyObject() method to check whether the array is empty or contains elements. The isEmptyObject() method accepts a single parameter of type Object, which is the object to be checked and returns a boolean value true if the object is empty and false if not empty.
The jQuery Object: The Wrapped Set: Selectors return a jQuery object known as the "wrapped set," which is an array-like structure that contains all the selected DOM elements. You can iterate over the wrapped set like an array or access individual elements via the indexer ($(sel)[0] for example).
The definition of is
:
Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
The problem is that since you have no elements, it's not possible that one of your elements matches some condition. jQuery is not even calling your code because there are no elements.
EDIT: To clarify slightly, your code is being called once for every element in your object (at least until one returns true). No elements means the code is never called. a
in your code is always a single element.
EDIT2: With that in mind, this would be a more efficient implementation of present
:
$.extend($.expr[':'],{
present: function(a) {
return true;
}
});
You can simply use
if($('element').length) // 1 or 0 will be returned
or
$.extend($.expr[':'],{
present: function(a) {
return $(a).length;
}
});
if($('#element').is(':present'))
{
// code for existence
}
else
{
// code for non-existence
}
Example.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With