[Javascript] आवश्यकताएँ domReady प्लगइन बनाम jQuery $ (दस्तावेज़) .ready ()?


Answers

आपके मुख्य प्रश्न का उत्तर देने का प्रयास:

आवश्यकताएँ एक domReady प्लगइन प्रदान करता है जब हमारे पास jquery's $(document).ready(); ?

वे वास्तव में दो अलग-अलग चीजें करते हैं। RequJS ' domReady निर्भरता domReady है कि इस मॉड्यूल को चलाने के पहले डीओएम को पूरी तरह से लोड करने की आवश्यकता होती है (और इसलिए यदि आप चाहें तो अपने आवेदन में मॉड्यूल की किसी भी संख्या में पाया जा सकता है), जबकि $(document).ready() इसके बजाए जब डोम लोड हो रहा है तो अपने कॉलबैक फ़ंक्शंस को निकाल देता है।

अंतर सूक्ष्म प्रतीत हो सकता है, लेकिन इसके बारे में सोचें: मेरे पास एक मॉड्यूल है जिसे किसी भी तरह से डीओएम के साथ जोड़ा जाना चाहिए, इसलिए मैं या तो domReady पर निर्भर हो सकता domReady और मॉड्यूल परिभाषा समय पर इसे domReady सकता हूं, या $(document).ready() डाल सकता हूं मॉड्यूल के लिए एक init फ़ंक्शन के लिए कॉलबैक के साथ $(document).ready() इसके अंत में। मैं पहला दृष्टिकोण क्लीनर कॉल करूंगा।

इस बीच, अगर मेरे पास कोई ऐसा ईवेंट है जो डीओएम तैयार होने के ठीक होने की आवश्यकता है, तो $(document).ready() ईवेंट जाना होगा, क्योंकि यह विशेष रूप से RequJS को मॉड्यूल लोड करने पर निर्भर नहीं करता है, बशर्ते जिस कोड से आप इसे कॉल कर रहे हैं उसकी निर्भरताएं पूरी की जाती हैं।

यह भी विचार करने लायक है कि आप जरूरी नहीं कि jQuery के साथ RequJS का उपयोग करें। कोई भी लाइब्रेरी मॉड्यूल जिसे DOM एक्सेस की आवश्यकता होती है (लेकिन jQuery पर निर्भर नहीं है) तब भी domReady का उपयोग कर उपयोगी domReady

Question

मैं RequJS का उपयोग कर रहा हूं और डीओएम तैयार पर कुछ शुरू करने की आवश्यकता है। अब, RequJS domReady प्लगइन प्रदान करता है, लेकिन हमारे पास पहले से ही jQuery की $(document).ready() , जो कि मेरे लिए उपलब्ध है क्योंकि मुझे jQuery की आवश्यकता है।

तो मुझे दो विकल्प मिल गए हैं:

  1. domReady प्लगइन का प्रयोग करें:

    require(['domReady'], function (domReady) {
        domReady(function () {
            // Do my stuff here...
        });
    });
    
  2. $(document).ready() उपयोग करें $(document).ready() :

    $(document).ready(function() {
        // Do my stuff here...
    });
    

मुझे कौन सा चुनना चाहिए, और क्यों?

दोनों विकल्प अपेक्षा के अनुसार काम करते हैं। मुझे jQuery की एक में विश्वास नहीं है क्योंकि RequJS अपने जादू कर रहा है; यही है, क्योंकि RequJS गतिशील रूप से स्क्रिप्ट जोड़ देगा, मुझे चिंता है कि सभी गतिशील रूप से अनुरोधित स्क्रिप्ट लोड होने से पहले डीओएम तैयार हो सकता है। जबकि, आवश्यकता जेएस केवल domReady लिए अतिरिक्त जेएस पर बोझ जोड़ domReady जब मेरे पास पहले से ही jQuery आवश्यक है।

प्रशन

  • जब हम jQuery के $(document).ready(); हो सकते हैं तो domReady एक domReady प्लगइन प्रदान करता है $(document).ready(); ? मुझे एक और निर्भरता शामिल करने का कोई फायदा नहीं दिख रहा है।
  • अगर यह सिर्फ एक आवश्यकता को खिलाने के लिए है, तो क्रॉस-ब्राउज़र AJAX के लिए क्यों नहीं प्रदान करें?

जहां तक ​​मुझे पता है, दस्तावेज़ के तैयार होने के बाद domReady आवश्यकता वाले मॉड्यूल को नहीं लाया जाएगा या निष्पादित नहीं किया जाएगा, और आप वही jQuery की आवश्यकता भी कर सकते हैं:

require(['jQuery'], function ($) {
    $(document).ready(function () {
        // Do my stuff here...
    });
});

मेरे प्रश्न पर अधिक स्पष्ट होने के लिए: domReady या jQuery आवश्यकता के बीच क्या अंतर है?




कुछ मॉड्यूल के साथ requjs के साथ प्रयोग करने के बाद मैं domReady का उपयोग करने का सुझाव देते हैं।

मैंने देखा कि $ (दस्तावेज़) .ready (...) से जुड़े फ़ंक्शन को तब नहीं कहा जाता है जब कई मॉड्यूल requjs द्वारा लोड किए जाते हैं। मुझे संदेह है कि सभी requjs कोड निष्पादित होने से पहले डोम तैयार हो रहा है और jquery तैयार कॉलबैक हैंडलर को उपयोगकर्ता परिभाषित फ़ंक्शन यानी मुख्य मॉड्यूल कोड के साथ बाध्य होने से पहले कहा जाता है।

require(['jquery',
    'underscore',
    'text!some_template.html',
    './my_module_1',
    './my_module_2',
    'domReady',
    'other_dependency_1',
    'other_dependency_2'
    ], function($, _, someTemplate, myModule1, myModule2, domReady) {

    $(document).ready(function() {
        console.info('This might never be executed.'); 
        console.info('Dom might get ready before requirejs would load modules.');
    });

    domReady(function () {
        console.info('This runs when the dom gets ready and modules are loaded.');
    });
});