अगर कोई चयनकर्ता अशक्त हो जाता है तो मैं कैसे पता लगा सकता हूं?

Question

यह पता लगाने का सबसे अच्छा तरीका क्या है कि एक jQuery- चयनकर्ता एक खाली वस्तु लौटाता है या नहीं। यदि तुम करो:

alert($('#notAnElement'));

आप [वस्तु वस्तु] प्राप्त करते हैं, इसलिए जिस तरह से मैं इसे करता हूं वह है:

alert($('#notAnElement').get(0));

जो "अपरिभाषित" लिखेगा, और इसलिए आप उसके लिए एक जांच कर सकते हैं। लेकिन यह बहुत बुरा लगता है। और क्या रास्ता है?

Answer 1

मेरा पसंदीदा इस छोटी सी सुविधा के साथ jQuery का विस्तार करना है:

$.fn.exists = function () {
    return this.length !== 0;
}

जैसे इस्तेमाल किया:

$("#notAnElement").exists();

लंबाई का उपयोग करने की तुलना में अधिक स्पष्ट।

Comments

आपने एक $ () के अंदर 'इस' को क्यों लपेट दिया? इस संदर्भ में 'यह' वास्तव में jQuery ऑब्जेक्ट को इंगित नहीं करेगा?

— अधम अट्ट

मुझे लगता है कि लौटने thisकी तुलना में बहुत अधिक उपयोगी है true। मेरे उत्तर को 'रेलिंग पोर्ट' presenceविधि देखें।

— मार्क-एंड्रे लाफ्यून

यदि आप श्रृंखला की क्षमता को बनाए रखना चाहते हैं, तो क्या फ़ंक्शन सही होना चाहिए, या यदि आप thisचर को असाइन करने के लिए इस पद्धति का उपयोग करना चाहते हैं , तो मैं सीएसआरआरपी के पास रिटर्न स्टेटमेंट को बदलने की सिफारिश करूंगा ।

— हन्ना

मैगनर, क्या आप बता सकते हैं कि यह "विस्तार" फ़ंक्शन वास्तव में कैसे काम करता है? मैं मान रहा हूं कि यह एक जावास्क्रिप्ट कॉन्सेप्ट है न कि एक सख्त JQuery कॉन्सेप्ट। मैंने प्रोटोटाइप में देखा, लेकिन मुझे यकीन नहीं है कि अगर यहां लागू होता है और वाक्यविन्यास "$ .fn" क्यों होगा।

— काइलएम

@ अदम हां। लेकिन उस स्थिति में, आपको बस मौजूद-चेक को छोड़ देना चाहिए, यह देखते हुए कि jQuery कैसे काम करता है। चयनकर्ता से मेल खाने वाला कोई तत्व नहीं है तो यह कुछ नहीं करेगा।

— मगंर

Answer 2

if ( $("#anid").length ) {
  alert("element(s) found")
} 
else {
  alert("nothing found")
}

Answer 3

चयनकर्ता jQuery वस्तुओं की एक सरणी देता है। यदि कोई मिलान तत्व नहीं मिलते हैं, तो यह एक खाली सरणी देता है। आप .lengthचयनकर्ता द्वारा लौटाए गए संग्रह की जाँच कर सकते हैं या जाँच सकते हैं कि पहला सरणी तत्व 'अपरिभाषित' है या नहीं।

आप IF कथन के अंदर किसी भी निम्नलिखित उदाहरण का उपयोग कर सकते हैं और वे सभी एक ही परिणाम देते हैं। सच है, अगर चयनकर्ता को एक मिलान तत्व मिला, तो गलत है।

$('#notAnElement').length > 0
$('#notAnElement').get(0) !== undefined
$('#notAnElement')[0] !== undefined

Comments

मैं उपयोग करता हूं .lengthजब तक कि कोड गर्म न हो। यह निश्चित रूप से इरादे के साथ सबसे स्पष्ट है। इसके अलावा, .size()पदावनत किया गया है और वर्षों से है (1.8 के बाद से)। मैं बस आपके उत्तर को संपादित करने जा रहा हूं और इसे हटा दूंगा, बेझिझक इसे नोट के साथ जोड़ सकता हूं लेकिन यह इतना पुराना है, मुझे लगता है कि यह बेहतर हो गया है।

— इवान कैरोल

तकनीकी रूप से यह एक jQuery ऑब्जेक्ट देता है जिसमें कोई DOM नोड नहीं है। यह कहते हुए कि यह एक खाली सरणी है, सही नहीं है।

— 19

Answer 4

मुझे ऐसा कुछ करना पसंद है:

$.fn.exists = function(){
    return this.length > 0 ? this : false;
}

तो आप कुछ इस तरह से कर सकते हैं:

var firstExistingElement = 
    $('#iDontExist').exists() ||      //<-returns false;
    $('#iExist').exists() ||          //<-gets assigned to the variable 
    $('#iExistAsWell').exists();      //<-never runs

firstExistingElement.doSomething();   //<-executes on #iExist

http://jsfiddle.net/vhbSG/

Comments

@ ईशान वास्तव में यह स्वीकृत उत्तर का डुप्लिकेट नहीं है ... ध्यान दें कि स्वीकृत उत्तर केवल सही / गलत मिलता है जबकि यह उत्तर या तो मूल वस्तु ("यह") या गलत है। यदि आप गैर-झूठ हैं तो यह उत्तर आपको रिटर्न वैल्यू (जैसे अतिरिक्त फ़ंक्शन चेनिंग) के साथ अतिरिक्त सामान करने की अनुमति देता है।

— RSW

मेरे मानक टूलकिट में समान कोड है। यह फ़ॉर्म रेल के ऑब्जेक्ट के बराबर है। @CSharp वर्णन करता है कि निर्माण कार्य में सुपर उपयोगी है।

— inopinatus

यह एक अच्छा जवाब है, लेकिन यह उपयोगी होगा यदि आप बताएं कि परीक्षण किए गए तत्वों में से कोई मौजूद होने पर क्या होता है। संक्षिप्त उत्तर: TypeError: firstExistingElement.doSomething is not a function। आप पूरे वैरिएबल असाइनमेंट / टेस्ट को एक () में लपेट सकते हैं और केवल कुछ कर सकते हैं यदि कोई एलीमेंट पाया जाता है ....

— Stephen R

Answer 5

मुझे रूबी ऑन रेल्सpresence से प्रेरित, का उपयोग करना पसंद है :

$.fn.presence = function () {
    return this.length !== 0 && this;
}

आपका उदाहरण बन जाता है:

alert($('#notAnElement').presence() || "No object found");

मुझे यह प्रस्तावित से बेहतर लगता है $.fn.exists क्योंकि आप अभी भी बूलियन ऑपरेटरों का उपयोग कर सकते हैं या if, लेकिन सत्य परिणाम अधिक उपयोगी है। एक और उदाहरण:

$ul = $elem.find('ul').presence() || $('<ul class="foo">').appendTo($elem)
$ul.append('...')

Answer 6

मेरी प्राथमिकता, और मुझे नहीं पता कि यह पहले से ही jQuery में क्यों नहीं है:

$.fn.orElse = function(elseFunction) {
  if (!this.length) {
    elseFunction();
  }
};

इस तरह इस्तेमाल किया:

$('#notAnElement').each(function () {
  alert("Wrong, it is an element")
}).orElse(function() {
  alert("Yup, it's not an element")
});

या, जैसा कि यह CoffeeScript में दिखता है:

$('#notAnElement').each ->
  alert "Wrong, it is an element"; return
.orElse ->
  alert "Yup, it's not an element"

Answer 7

यह JQuery के दस्तावेज़ में है:

http://learn.jquery.com/using-jquery-core/faq/how-do-i-test-whether-an-element-exists/

  alert( $( "#notAnElement" ).length ? 'Not null' : 'Null' );

Answer 8

आप इसे हर समय डिफ़ॉल्ट रूप से करना चाह सकते हैं। मैं त्रुटि के बिना ऐसा करने के लिए jquery फ़ंक्शन या jquery.fn.init पद्धति को लपेटने के लिए संघर्ष कर रहा हूं, लेकिन आप ऐसा करने के लिए jquery स्रोत में एक साधारण बदलाव कर सकते हैं। कुछ आसपास की लाइनें शामिल हैं जिन्हें आप खोज सकते हैं। मैं के लिए jquery स्रोत खोजने की सलाह देता हूंThe jQuery object is actually just the init constructor 'enhanced'

var
  version = "3.3.1",

  // Define a local copy of jQuery
  jQuery = function( selector, context ) {

    // The jQuery object is actually just the init constructor 'enhanced'
    // Need init if jQuery is called (just allow error to be thrown if not included)
    var result = new jQuery.fn.init( selector, context );
    if ( result.length === 0 ) {
      if (window.console && console.warn && context !== 'failsafe') {
        if (selector != null) {
          console.warn(
            new Error('$(\''+selector+'\') selected nothing. Do $(sel, "failsafe") to silence warning. Context:'+context)
          );
        }
      }
    }
    return result;
  },

  // Support: Android <=4.0 only
  // Make sure we trim BOM and NBSP
  rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;

jQuery.fn = jQuery.prototype = {

अंतिम लेकिन कम से कम, आप यहाँ असंपीड़ित jquery स्रोत कोड प्राप्त कर सकते हैं: http://code.jquery.com/