जवाबों:
window.onload = myOnloadFuncऔर एक ही घटना<body onload="myOnloadFunc();"> का उपयोग करने के विभिन्न तरीके हैं । उपयोग करना कम अप्रिय है हालांकि - यह आपके जावास्क्रिप्ट को HTML से बाहर ले जाता है।window.onload
सभी सामान्य जावास्क्रिप्ट लाइब्रेरीज़, प्रोटोटाइप, एक्सटीजेएस, डोज़ो, JQuery, YUI, आदि उन घटनाओं के आसपास अच्छे रैपर प्रदान करते हैं जो दस्तावेज़ लोड होने के बाद होते हैं। आप विंडो ऑनलॉइड ईवेंट के लिए सुन सकते हैं, और उस पर प्रतिक्रिया कर सकते हैं, लेकिन ऑनलॉड को तब तक निकाल नहीं दिया जाता है जब तक कि सभी संसाधन डाउनलोड नहीं किए जाते हैं, इसलिए आपके ईवेंट हैंडलर को तब तक निष्पादित नहीं किया जाएगा, जब तक कि अंतिम विशाल छवि को प्राप्त नहीं किया गया हो। कुछ मामलों में यह वही है जो आप चाहते हैं, दूसरों में आप पा सकते हैं कि डोम तैयार होने पर सुनना अधिक उपयुक्त है - यह घटना ओनलोड के समान है, लेकिन छवियों के इंतजार के बिना आग, आदि डाउनलोड करने के लिए।
myOnloadFunc()वैश्विक संदर्भ में कॉल करने वाली है ( thisसंदर्भित होगी window)। जावास्क्रिप्ट के माध्यम से इसे स्थापित करने से यह तत्व के संदर्भ में निष्पादित होगा (उस तत्व को thisसंदर्भित करता है जिस पर घटना को चालू किया गया था)। इस विशेष मामले में, इससे कोई फर्क नहीं पड़ेगा, लेकिन यह अन्य तत्वों के साथ होगा।
thisकरने से उस ऑब्जेक्ट को ओवरराइड किया जा सकता है जो वांछित होने पर संदर्भित करता है।
कोई अंतर नहीं है, लेकिन आपको उपयोग नहीं करना चाहिए।
कई ब्राउज़रों में, window.onloadघटना को तब तक ट्रिगर नहीं किया जाता है जब तक कि सभी चित्र लोड नहीं हो जाते हैं, जो कि आप चाहते हैं। मानक आधारित ब्राउज़रों में एक घटना होती है जिसे DOMContentLoadedपहले आग कहा जाता है , लेकिन यह IE (इस उत्तर को लिखने के समय) द्वारा समर्थित नहीं है। मैं एक जावास्क्रिप्ट लाइब्रेरी का उपयोग करने की सलाह दूंगा जो क्रॉस ब्राउज़र DOMContentLoaded सुविधा का समर्थन करता है, या एक अच्छी तरह से लिखित फ़ंक्शन ढूंढना जो आप उपयोग कर सकते हैं। jQuery का $(document).ready(), एक अच्छा उदाहरण है।
window.onloadशरीर के बिना काम कर सकते हैं। केवल स्क्रिप्ट टैग के साथ पृष्ठ बनाएं और इसे ब्राउज़र में खोलें। पृष्ठ में कोई भी निकाय शामिल नहीं है, लेकिन यह अभी भी काम करता है ..
<script>
function testSp()
{
alert("hit");
}
window.onload=testSp;
</script><!ELEMENT html (head, body)>[1] - और html401 <!ELEMENT HTML O O (%html.content;)के <!ENTITY % html.content "HEAD, BODY">रूप में अच्छी तरह से निर्दिष्ट करता है [२]। html51 A head element followed by a body element.HTML सामग्री के लिए भी बताता है । [३] w3.org/TR/xhtml1/dtds.html#a_dtd_XHTML-1.0-Strict w3.org/TR/xhtml1/dtds.html#a_dtd_XHTML-1.0-Stash w3.org/TR/html51/semantics.html#the -html तत्व - तो मैं उन आम / में उपयोग एचटीएमएल मानकों के सभी लगता है कि ऐसा एक शरीर टैग की आवश्यकता है। :)
Start tag: optional, End tag: optional
मैं पसंद करता हूं, आम तौर पर, > ईवेंट का उपयोग नहीं करने के लिए <body onload=""। मुझे लगता है कि व्यवहार को यथासंभव सामग्री से अलग रखना क्लीनर है।
उस ने कहा, ऐसे अवसर होते हैं (आमतौर पर मेरे लिए बहुत दुर्लभ) जहां शरीर के भार का उपयोग करने से थोड़ी गति बढ़ सकती है।
मुझे प्रोटोटाइप का उपयोग करना पसंद है इसलिए मैं आमतौर पर <headअपने पेज के > में कुछ इस तरह से डालता हूं:
document.observe("dom:loaded", function(){
alert('The DOM is loaded!');
});या
Event.observe(window, 'load', function(){
alert('Window onload');
});ऊपर दी गई तरकीबें मैंने यहाँ सीखी हैं । मैं HTML के बाहर अटैच इवेंट हैंडलर्स की अवधारणा का बहुत शौकीन हूं।
(कोड में वर्तनी की गलती को सुधारने के लिए संपादन करें।)
'एक वस्तुनिष्ठ प्रश्न के इतने व्यक्तिपरक उत्तर। "विनीत" जावास्क्रिप्ट अंधविश्वासों का उपयोग न करने के पुराने नियम की तरह अंधविश्वास है। एक ऐसे तरीके से कोड लिखें, जो आपको अपने लक्ष्य को पूरा करने में मदद करता है, न कि किसी की धार्मिक धार्मिक मान्यताओं के अनुसार।
जो कोई भी मिल जाए:
<body onload="body_onload();">अत्यधिक विचलित होने के लिए अत्यधिक दिखावा है और उनकी प्राथमिकताएं सीधे नहीं हैं।
मैं सामान्य रूप से अपना जावास्क्रिप्ट कोड एक अलग .js फ़ाइल में डालता हूं, लेकिन मुझे HTML में ईवेंट हैंडलर को हुक करने के बारे में कुछ भी बोझिल नहीं लगता है, जो कि वैध HTML है।
window.onload- सभी डोम, जेएस फाइल, इमेज, इफ्रेम, एक्सटेंशन और अन्य के बाद पूरी तरह से लोड होने के बाद कॉल किया गया। यह $ (विंडो) .load (फ़ंक्शन () {}) के बराबर है;
body onload=""- DOM लोड होते ही कॉल किया जाता है। यह $ (दस्तावेज़) के बराबर है। पहले से ही (फ़ंक्शन () {});
readyबनाम onloadघटनाओं के बारे में सबसे बड़ी गलतफहमी के रूप में उद्धृत किया जाता है। loadसंपूर्ण स्क्रिप्ट, चित्र और स्टाइलशीट सहित संपूर्ण दस्तावेज़ लोड होने के बाद आग। DOMContentLoadedDOM ट्री के बनने के बाद आग लग जाती है लेकिन छवियों आदि से पहले इसकी DOMContentLoadedसमतुल्यता होती है document.ready, नहीं load।
यदि आप विनीत JS कोड लिखने की कोशिश कर रहे हैं (और आपको होना चाहिए), तो आपको उपयोग नहीं करना चाहिए <body onload="">।
यह मेरी समझ है कि अलग-अलग ब्राउज़र इन दोनों को थोड़ा अलग तरीके से संभालते हैं लेकिन वे इसी तरह काम करते हैं। अधिकांश ब्राउज़रों में, यदि आप दोनों को परिभाषित करते हैं, तो एक को अनदेखा कर दिया जाएगा।
किसी अन्य विशेषता की तरह ओनलोड के बारे में सोचें। उदाहरण के लिए, आप इनपुट बॉक्स पर रख सकते हैं:
<input id="test1" value="something"/>या आप कॉल कर सकते हैं:
document.getElementById('test1').value = "somethingelse";ओनलोड विशेषता उसी तरह काम करती है, सिवाय इसके कि यह एक फ़ंक्शन को स्ट्रिंग के बजाय इसके मूल्य के रूप में लेता है जैसे कि मूल्य विशेषता करता है। यह भी बताता है कि आप "केवल उनमें से एक का उपयोग क्यों कर सकते हैं" - कॉलिंग window.onload शरीर टैग के लिए ऑनलोड विशेषता के मूल्य को पुन: असाइन करता है।
साथ ही, जैसे अन्य यहाँ कह रहे हैं, आमतौर पर यह पेज की सामग्री से अलग शैली और जावास्क्रिप्ट को रखने के लिए क्लीनर है, यही वजह है कि ज्यादातर लोग window.onload या jQuery के तैयार फ़ंक्शन की तरह उपयोग करने की सलाह देते हैं।
<body onload = ""> window.onload को ओवरराइड करना चाहिए।
<Body onload = ""> के साथ, document.body.onload ब्राउज़र के आधार पर अशक्त, अपरिभाषित या एक फ़ंक्शन हो सकता है (हालाँकि getAttribute ("onload") अनाम फ़ंक्शन के शरीर को स्ट्रिंग के रूप में प्राप्त करने के लिए कुछ हद तक सुसंगत होना चाहिए) । Window.onload के साथ, जब आप इसे एक फंक्शन असाइन करते हैं, तो window.onload ब्राउज़र में लगातार एक फंक्शन होगा। यदि वह आपके लिए मायने रखता है, तो window.onload का उपयोग करें।
window.onload वैसे भी JS को आपकी सामग्री से अलग करने के लिए बेहतर है। जब आप window.onload का उपयोग कर सकते हैं, तब भी <body onload = ""> का उपयोग करने का बहुत कारण नहीं है।
ओपेरा में, window.onload और <body onload = ""> (और यहां तक कि window.addEventListener ("लोड", func, false)) के लिए ईवेंट लक्ष्य सफारी और फ़ायरफ़ॉक्स जैसे दस्तावेज़ के बजाय विंडो होगा। लेकिन, 'यह' ब्राउज़रों के बीच की खिड़की होगी।
इसका मतलब यह है कि, जब यह मायने रखता है, तो आपको क्रूड को लपेटना चाहिए और चीजों को लगातार बनाना चाहिए या एक पुस्तकालय का उपयोग करना चाहिए जो आपके लिए करता है।
वे दोनों एक ही काम करते हैं। हालांकि, ध्यान दें कि यदि दोनों को परिभाषित किया गया है, तो उनमें से केवल एक को ही आमंत्रित किया जाएगा। मैं आम तौर पर दोनों में से किसी एक का उपयोग करने से सीधे बचता हूं। इसके बजाय, आप एक ईवेंट हैंडलर को लोड ईवेंट में संलग्न कर सकते हैं। इस तरह आप अधिक आसानी से अन्य जेएस पैकेजों को शामिल कर सकते हैं जिन्हें ऑनलोड घटना के लिए कॉलबैक संलग्न करना पड़ सकता है।
किसी भी जेएस फ्रेमवर्क में इवेंट हैंडलर के लिए क्रॉस-ब्राउज़र तरीके होंगे।
सामग्री, लेआउट और व्यवहार अलग-अलग होना एक स्वीकृत मानक है। तो window.onload () उपयोग करने के लिए अधिक उपयुक्त होगा, <body onload="">हालांकि दोनों समान कार्य करते हैं।
एक और 3 साल की नींद के बाद फिर से इस धागे के पुनर्जन्म के लिए खेद है, लेकिन शायद मैंने अंततः window.onload=fn1;ओवर का निर्विवाद लाभ पाया है <body onload="fn1()">। यह जेएस मॉड्यूल या ईएस मॉड्यूल की चिंता करता है : जब आपका onloadहैंडलर "क्लासिकल" जेएस फाइल में रहता है (अर्थात बिना <script type="module" … >किसी भी तरीके से, संभव है; जब आपका onloadहैंडलर "मॉड्यूल" जेएस फाइल में रहता है (यानी के साथ संदर्भित <script type="module" … >, तो <body onload="fn1()">fn1 के साथ विफल हो जाएगा) () परिभाषित नहीं किया गया है "त्रुटि। कारण शायद यह है कि ES मॉड्यूल HTML लोड होने से पहले लोड नहीं किए जाते हैं ... लेकिन यह सिर्फ मेरा अनुमान है। किसी भी तरह, window.onload=fn1;मॉड्यूल के साथ पूरी तरह से काम करता है ...