Trả về "True" trên Empty Selector Array rỗng?

Question

Tôi đang làm việc để tạo ra một cách ngữ nghĩa hơn để kiểm tra các phần tử với jQuery. Sử dụng $("#element").length > 0 chỉ không thực sự cảm thấy rất tốt worded với tôi, vì vậy tôi khi bổ sung chọn của riêng tôi để sử dụng trong .is:

if($("#element").is(":present")) { 
    console.log("It's aliiiveeee!!"); 
} 

phần Đó là dễ dàng, như thế này:

$.extend($.expr[':'],{ 
    present: function(a) { 
     return $(a).length > 0; 
    } 
}); 

Tôi muốn tiến một bước xa hơn và giúp bạn dễ dàng biết phần tử không tồn tại hay không, sử dụng cú pháp tương tự:

$.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."); 
    } 
}); 

Nhưng phần này đáng ngạc nhiên là khó làm. Tôi nghĩ rằng đó là bởi vì tôi đang paring xuống các yếu tố trả về để có được một kết quả, và paring chọn để .length === 0 là giống như yêu cầu không có elelements: nó trả về false không có vấn đề gì.

Tôi đã thử rất nhiều cách khác nhau để đảo ngược mọi thứ và có được điều này để trở về đúng khi nguyên tố này không tồn tại, và false nếu nó:

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... 

Có một cách dễ dàng để có được điều này để chỉ trả về true nếu phần tử không tồn tại, và false nếu nó không?

Answer 1

Định nghĩa của is:

Kiểm tra các thiết lập phù hợp với hiện tại của các yếu tố chống lại một chọn, phần tử, hoặc đối tượng jQuery và trả về true nếu ít nhất một trong các yếu tố phù hợp với lập luận đưa ra.

Vấn đề là do bạn không có yếu tố, không thể một trong các yếu tố của bạn khớp với một số điều kiện. jQuery thậm chí không gọi mã của bạn vì không có phần tử nào.

EDIT: Để làm rõ một chút, mã của bạn đang được gọi một lần cho mọi phần tử trong đối tượng của bạn (ít nhất là cho đến khi một phần tử trả về true). Không có yếu tố có nghĩa là mã không bao giờ được gọi. a trong mã của bạn luôn là một phần tử duy nhất.

EDIT2: Với ý nghĩ đó, đây sẽ là một việc thực hiện hiệu quả hơn present:

$.extend($.expr[':'],{ 
    present: function(a) { 
     return true; 
    } 
}); 

Answer 2

0 là "giả" trong JavaScript.

Bạn chỉ có thể trả lại !$(a).length.

Answer 3

Làm thế nào về:

if (!$(a)[0]) { 
    // $(a) is empty 
} 

Vì vậy, $(a)[0] lấy phần tử đầu tiên trong đối tượng jQuery. Nếu phần tử đó là null/undefined, điều đó có nghĩa là đối tượng jQuery rỗng.

Answer 4

Bạn chỉ có thể sử dụng

if(​$('element').length) // 1 or 0 will be returned 

hoặc

$.extend($.expr[':'],{ 
    present: function(a) { 
     return $(a).length; 
    } 
}); 

if($('#element').is(':present')) 
{ 
    // code for existence 
} 
else 
{ 
    // code for non-existence 
} 

Example .

Answer 5

Cho rằng $().is() thậm chí sẽ không chạy khi bộ sưu tập trống, bộ chọn :present thay vì thừa. Vì vậy, thay vì chơi với $.expr[':'], tôi muốn đi với mở rộng $.fn chứa chức năng phù hợp, ví dụ:

$.fn.extend({ 
    hasAny: function() { 
     return this.length > 0; 
    }, 
}); 

hoặc

$.fn.extend({ 
    isEmpty: function() { 
     return this.length == 0; 
    }, 
}); 

Lý do cá nhân tôi sẽ đi với phương pháp này là selectors thường sử dụng để kiểm tra tính chất đặc biệt của các yếu tố (so sánh :checked, :enabled, :selected, :hover, vv), không các thuộc tính của nguyên tố jQuery thiết lập như là một tổng thể (ví dụ .size(), 01.).

Cách sử dụng dĩ nhiên sẽ tương tự như sau:

if ($('#element').isEmpty()) 
    console.log("He's dead, Jim.");