关于javascript:如果元素存在然后检查?

If element exist then check?

代码在访问网页时会起作用,它会自动隐藏#OrderDeliveryAddress div。 但我想知道这是正确的做法吗?

有没有办法检查.selectAddressList div / class是否先存在,然后检查值?

1
2
3
4
5
$(document).ready(function() {
    if ($(".selectAddressList").val() =="selectAddressBook") {
         $("#OrderDeliveryAddress").hide();
    }
});


我个人会用:

1
if ($(".selectAddressList").length > 0)

这将检查jQuery对象是否包含任何项目,换句话说,是否与您传入的选择器匹配。


if($(".selectAddressList").length > 0)

乍一看,您正在使用类选择器 - 您是否在页面上使用此类有多个项目?如果是这样,当你检查它/它们的.val()时,你可能会遇到冲突。如果没有,您可以考虑使用元素id而不是class


我在这里用以下插件回答了同样的问题。有关创建插件的详细信息,请访问答案。

如果元素存在,以下插件将允许您使用回调功能(保持与jQuery样式标记内联)。因此,对于您的示例,您可能会执行以下操作:

1
2
3
$(".selectAddressList").exist(function() { // with NO PARAM, will ONLY fire if element exist
    /*  DO WORK     */
})  //  notice, this maintains"chainability", so you could make more calls on this element

插入

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
(function($) {
    if (!$.exist) {
        $.extend({
            exist: function() {
                var ele, cbmExist, cbmNotExist;
                if (arguments.length) {
                    for (x in arguments) {
                        switch (typeof arguments[x]) {
                            case 'function':
                                if (typeof cbmExist =="undefined") cbmExist = arguments[x];
                                else cbmNotExist = arguments[x];
                                break;
                            case 'object':
                                if (arguments[x] instanceof jQuery) ele = arguments[x];
                                else {
                                    var obj = arguments[x];
                                    for (y in obj) {
                                        if (typeof obj[y] == 'function') {
                                            if (typeof cbmExist =="undefined") cbmExist = obj[y];
                                            else cbmNotExist = obj[y];
                                        }
                                        if (typeof obj[y] == 'object' && obj[y] instanceof jQuery) ele = obj[y];
                                        if (typeof obj[y] == 'string') ele = $(obj[y]);
                                    }
                                }
                                break;
                            case 'string':
                                ele = $(arguments[x]);
                                break;
                        }
                    }
                }

                if (typeof cbmExist == 'function') {    //  has at least one Callback Method
                    var exist =  ele.length > 0 ? true : false; //  strict setting of boolean
                    if (exist) {    // Elements do exist
                        return ele.each(function(i) { cbmExist.apply(this, [exist, ele, i]); });
                    }
                    else if (typeof cbmNotExist == 'function') {
                        cbmNotExist.apply(ele, [exist, ele]);
                        return ele;
                    }
                    else {
                        if (ele.length <= 1) return ele.length > 0 ? true : false;
                        else return ele.length;
                    }
                }
                else {  //  has NO callback method, thus return if exist or not based on element existant length
                    if (ele.length <= 1) return ele.length > 0 ? true : false; //   strict return of boolean
                    else return ele.length; //  return actual length for how many of this element exist
                }

                return false; //    only hits if something errored!
            }
        });
        $.fn.extend({
            exist: function() {
                var args = [$(this)];
                if (arguments.length) for (x in arguments) args.push(arguments[x]);
                return $.exist.apply($, args);
            }
        });
    }
})(jQuery);

jsFiddle


你可以这样说:

1
if ($(".selectAddressList").length)

因为0在这种情况下意味着错误,其他一切都会评估为真。