javascript check object exists

Question

I have following code to check the object whether exists for item listing. For testing purpose, i only have one object sub_total_0, however the script keep looping because typeof cannot determine sub_total_1 is undefined or not exists, and keep going 2,3,4,5,...

var i = 0;
while (typeof document.getElementById("sub_total_" + i) != "undefined") {
    var obj_sub_total = document.getElementById("sub_total_" + i);
    if (obj_sub_total != "undefined") {
        if (fr.order_method_id.value == 1) {
            obj_sub_total.style.visibility = "visible";
        } else {
            obj_sub_total.style.visibility = "hidden";
        }
    }
    i++;
}

Quentin · Accepted Answer · 2015-03-31 11:24:22Z

1

You have

typeof document.getElementById("sub_total_" + i) != "undefined"

and

if (obj_sub_total != "undefined") {

getElementById returns either null or an HTML element. Neither of these are the string "undefined" and the type of each of this will be "object". Thus your conditions don't make sense.

You test for truthfulness instead. An HTML element will always be true and null will always be false.

while (document.getElementById("sub_total_" + i)) {

and

if (obj_sub_total) {

answered Mar 31, 2015 at 11:24

Quentin

948k136 gold badges1.3k silver badges1.4k bronze badges

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

Comments

T.J. Crowder · Accepted Answer · 2015-03-31 11:29:04Z

Your check doesn't work because using typeof on getElementById's return value will always give you "object", because it returns null if it can't find it, and typeof null is "object".

Just check the return value directly: If there's an element, it's a "truthy" value (one that coerces to true when used as a condition); if there isn't one, null is a "falsey" value (coerces to false).

So:

while (document.getElementById("sub_total_" + i)) {

You also don't need to look it up twice, which is what you're currently doing; instead:

var obj_sub_total;
while ((obj_sub_total = document.getElementById("sub_total_" + i)) != null) {

(You don't technically need the != null there, but without it it looks a bit like you've accidentally used = where you wanted ==.)

Another alternative would be to use a class and querySelectorAll:

var list = document.querySelectorAll(".sub_total");

Then loop while i is < list.length, e.g.:

var list = document.querySelectorAll(".sub_total");
for (i = 0; i < list.length; ++i) {
    var obj_sub_total = list[i];
    // ...
}

Or you could do that even when using ids:

var list = document.querySelectorAll("[id^=sub_total]");

Arun P Johny · Accepted Answer · 2015-03-31 11:34:20Z

1

getElementById() return null if element is not found, and the type of null is object that is why your condition is not working.

You can just check whether it is a truthy value and since the while() loop validates the object there is no need for the if condition

var i = 0,
    obj_sub_total;
while (obj_sub_total = document.getElementById("sub_total_" + i)) {
    console.log(obj_sub_total)
    if (fr.order_method_id.value == 1) {
        obj_sub_total.style.visibility = "visble";
    } else {
        obj_sub_total.style.visibility = "hidden";
    }
    i++;
}

Demo: Fiddle

edited Mar 31, 2015 at 11:34

answered Mar 31, 2015 at 11:24

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

Collectives™ on Stack Overflow

javascript check object exists

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related