jQuery: how to do something only if element exist?

Question

I'm new to jQuery and i think this question was answered many times. But i can't suggest how to find it. While writing jQuery code, i often write constructions where selector is repeated:

if( $( ".someclass .someclass #someid" ).filter( ":visible" ) ) { $( ".someclass .someclass #someid" ).filter( ":visible" ).click(); // This must be executed only if element was found. return; } // This must be executed only if first element not found if( $( ".someotherclass #someotherid" ).filter( ":hidden" ) ) { $( ".someotherclass #someotherid" ).filter( ":hidden" ).show(); return; }

As you can see, selector text is repeated. Is it any way to re-use result of last matched selector inside "if()"? For example, something like:

if( $( ".someclass .someclass #someid" ).filter( ":visible" ) ) { $( ":last-result" ).click(); return; } if( $( ".someotherclass #someotherid" ).filter( ":hidden" ) ) { $( ":last-result" ).show(); return; }

this might help: stackoverflow.com/questions/31044/…

user400654
– user400654

2013-04-05 16:15:54 +00:00
Commented Apr 5, 2013 at 16:15 — user400654
– user400654, Commented Apr 5, 2013 at 16:15

Denys Séguret · Accepted Answer · 2013-04-05 16:18:13Z

3

Simply don't test, this won't make any error if there is no matching element :

$( ".someclass .someclass #someid:visible").click();

This being said, as you can only have one element with a given id, you probably should use

$("#someid:visible").click();

Now, supposing you really want to do a test, then you may use

$("#someid:visible").each(function(){ var $element = $(this); // use $element });

Another basic solution is to cache your element before the test :

 var $element = $("#someid"); if ($element.is(":visible")) { // use $element }

edited Apr 5, 2013 at 16:18

answered Apr 5, 2013 at 16:11

Denys Séguret

384k90 gold badges813 silver badges780 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

grigoryvp Over a year ago

This was my first fought :). Unfortunately, in many cases i need to click/show/hide and do something else. For example, in my code sample - return from method. Or write something to log. Or whatever.

Denys Séguret Over a year ago

It's not clear what you want but you can use this in most cases if you use each.

grigoryvp Over a year ago

@Kevin Sorry, i can't understand. If i add it to next line after "click" - it will execute if element is visible and if it's not visible. And it's common to do logic like "if something is visible - hide and return. Than check if something else if not visible, if so - show and return. Finally, check some element has text. If so, clear and return."

grigoryvp Over a year ago

Yes, something like temporary variable. Does jQuery provides some shortcut to it like "last-match"?

Denys Séguret Over a year ago

No, that wouldn't really make sense. If you need to use a value more than once, declare a variable. See the various solutions in my answer.

Community · Accepted Answer · 2017-05-23 12:13:01Z

If you really want to do something only if element exist

$('element').length == 0; // no element found

By using the .length property we can test whether an element exists, or whether it has been found in the page.

Collectives™ on Stack Overflow

jQuery: how to do something only if element exist?

2 Answers 2

5 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Linked

Related