4

Let's say we have:

var $letsTestA = $( '.lets-test-a' ),
    $letsTestB = $( '.lets-test-b' );

While the HTML is:

<div class="lets-test-a"></div>

(I know, I left out .lets-test-b)

Now, what happens if we try to call the variable $letsTestB?

I did do some testing, I'm not just blindly asking a question without doing some research first, but I'm a little confused with how this seems to work...

If I alert($letsTestA); or alert($letsTestB); I get the same outcome which is just [object Object] when testing from JSFiddle?

Here's my test fiddle: https://jsfiddle.net/m6j03423/

Furthermore to this, what I'm actually trying to do here is create a way to find out whether the content of a variable exists or not.

In PHP I would just write if (empty($myVar)) { // do action } but JS doesn't work the same way.

In JS I think I can write if ($letsTestA) { } and it should be able to print the result of the variable? But, I'm still getting [object Object].

What am I missing?

Can I even print the contents of a jQuery object?

How can I test whether the variable contains the true value of a jQuery object?

EDIT: Admittedly, I did see a few different answers saying to check the length, but I didn't understand that enough to connect that to what I'm doing.

mattroberts33
  • 260
  • 5
  • 19
  • 3
    You're not printing it, you're alerting it. Log it to the console and go from there. – Dave Newton Feb 14 '17 at 13:40
  • just log it and check the console – sTx Feb 14 '17 at 13:43
  • 1
    A jQuery selector *always* returns a jQuery object - hence why there's no error and also why jQuery tolerates calling methods on non-existant elements. Sometimes that jQuery object contains one or more elements, other times it will be empty if none were found. To check this use the `length` property. If you haven't already I'd strongly suggest you read some of the jQuery user guides at http://learn.jquery.com/ – Rory McCrossan Feb 14 '17 at 13:43
  • 1
    Both calls to the jQuery function are returning an object. The `alert()` is confirming that. What's *in* that object, you're not examining. Debug the code. If you want to know what's in those variables, pause execution at that point and examine the runtime values of those variables. – David Feb 14 '17 at 13:43
  • I'm coming from PHP, I thought PHP was supposed to be the messy one, JS just seems to be doing some things very differently. I appreciate your comments. I didn't even think logging it would make a difference, but yeah when I log it and open it up length is one of the properties. – mattroberts33 Feb 14 '17 at 13:44
  • So, with that, what exactly does it return? Just an empty object? – mattroberts33 Feb 14 '17 at 13:46
  • Different != Messy. Plus this isn't a JavaScript issue, but a jQuery one. – Dave Newton Feb 14 '17 at 13:50
  • @DaveNewton for sure! But it would definitely be nice to just be able to see if the thing exists or not lol, length seems like more of a hack, but I guess it's clean. – mattroberts33 Feb 14 '17 at 13:51
  • @mattroberts33 JQuery function generally returns itself-this IDs why you can chain jQuery functions-one of its strengths. If you returned a null everything would blow up. It's a common technique for internal DSLs across languages. – Dave Newton Feb 14 '17 at 14:06

1 Answers1

1

You can use the .length property of the object to ascertain whether elements exists or not

 if ($letsTestA.length > 0) {
     //element exists
 }


var $letsTestA = $('.lets-test-a'),
    $letsTestB = $('.lets-test-b');

console.log($letsTestA.length);
console.log($letsTestB.length);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="lets-test-a"></div>
Satpal
  • 132,252
  • 13
  • 159
  • 168
  • 1
    I have to wait a few minutes to accept your answer. Thanks! I'm coming from PHP, I would never think to check the length to see if there's anything in it. – mattroberts33 Feb 14 '17 at 13:45
  • Now that I know `.length` is used for this, I was doing some looking around, apparently the `> 0` isn't necessary, but I guess it's faster than writing `=== true`? – mattroberts33 Feb 14 '17 at 13:57
  • 1
    @mattroberts33 You'll want to look up "JavaScript truthiness". – Dave Newton Feb 14 '17 at 17:15