स्पीकर 1: अब, कि पिछले उदाहरण में हम कुछ interspersed कि याद मेरी HTML के अंदर जावास्क्रिप्ट कोड, विशेष रूप से, के मूल्य के अंदर जमा पर बुलाया विशेषता उस प्रपत्र टैग के लिए. अब छोटे पन्नों के लिए, इस इतना बड़ा सौदा नहीं है. लेकिन एक वेब पेज को अब और अधिक हो जाता है जटिल, बस डाल अपने अंदर यहाँ और वहाँ जावास्क्रिप्ट कोड विशेषताओं का मूल्य नहीं है की सर्वश्रेष्ठ डिजाइन. सबसे अच्छा है हम कि बाहर कारक और अगर कम से कम के अंदर रख दिया केंद्रीय स्क्रिप्ट टैग. 

ऐसा करने के लिए कैसे? खैर चलो मेरे फार्म टैग करने के लिए वापस जाने और पहले इस विशेषता और इसके हटाना कुल मिलाकर महत्व देते हैं. तो यहाँ है, बजाय एक परिभाषित नमस्कार बुलाया समारोह, चलो पर लटका कोड की लाइन के लिए कि अंततः हम अभी भी निष्पादित और बदलना चाहते हैं जाएगा इस प्रकार के रूप नमस्कार समारोह. Document.get तत्व द्वारा आईडी गंदें शब्द बोलना डेमो बोली - डेमो, याद है, अद्वितीय है, जहां फार्म के लिए ही पहचानकर्ता - डॉट पर नाम है जो याद करते हैं, प्रस्तुत ईवेंट हैंडलर की जिसमें हम रुचि रखते हैं. और चलो हैंडलर प्रस्तुत उस पर आवंटित वास्तव में है कि मूल्य एक खुद कार्य करते हैं. 

अब मैं वास्तव में नहीं हूँ कि नोटिस यहां एक समारोह बुला. मैं बजाय एक गुमनाम परिभाषित कर रहा हूँ, अन्यथा एक लैम्ब्डा समारोह के रूप में जाना जाता है, इन घुंघराले ब्रेसिज़ के बीच निर्दिष्ट द्वारा कोड का एक गुच्छा है कि होना चाहिए वास्तव में क्रियान्वित किया. विशेष रूप से, मैं चाहता हूँ कि कोड निष्पादित करने के लिए है कि मैं था कि रेखा है इससे पहले, और फिर उस को जोड़ दें इस फार्म नहीं है कि इतनी झूठी वापसी अंततः दूरदराज के वेब समाप्त करने के लिए प्रस्तुत परंपरागत तरीके से सर्वर. 

चलो अब, इस फाइल को बचाने के लिए इसे खोल दो. एक ब्राउज़र में, और देखो क्या होता है. http://localhost/dom-1.html. चलो अब मेरे नाम में टाइप करते, दाऊद, सबमिट करें. और कुछ भी नहीं हुआ प्रतीत होता है मेरे पृष्ठ के यूआरएल के लिए लगता है, सिवाय फार्म का था, हालांकि के रूप में बदल गया है वास्तव में एक ही फाइल को प्रस्तुत की. 

अब यही वजह है कि हो सकता है? वैसे मैं कुछ और जानकारी की जरूरत है. तो चलो आगे चलते हैं और क्रोम के ऊपर खुला डेवलपर उपकरण इतना है कि मैं वास्तव में यह कर सकते हैं देखने के लिए सांत्वना खिड़की पर देखने के लिए मैंने कुछ गलत किया है. मैं के माध्यम से उस तक पहुँच सकते हैं तरीके के एक जोड़े. जिनमें से एक है, यहाँ यह मेनू के माध्यम से है तो उपकरण के तहत, तब तक नीचे डेवलपर उपकरण. 

और, यहाँ कंसोल टैब में नोटिस एक uncaught प्रकार की त्रुटि नहीं कर सकते, वहाँ अशक्त जमा पर गुण सेट. अब यही वजह है कि हो सकता है? खैर वापस अपने स्रोत कोड में यहाँ, नोटिस उस पर मुझे लगता पेश एक जिसका तत्व की संपत्ति अद्वितीय पहचानकर्ता डेमो है. एक तत्व है, फिर से, बस है एक पेड़ में एक नोड. 

तो यह मेरे ब्राउज़र नहीं करता प्रतीत होता है कि आपको लगता है कि उस तत्व या नोड अभी तक मौजूद है. और वास्तव में, यह नहीं है. एक वेब पेज पार्स है कि स्मरण करो या पढ़ा एक वेब ब्राउज़र से, नीचे से ऊपर, सही करने के लिए छोड़ दिया है. और इसलिए जब जावास्क्रिप्ट कोड है का सामना करना पड़ा, जो आम तौर पर, यह मार डाला है सही दूर. 

लेकिन इस मामले में, हम भी नहीं मिल गया है अभी तक डोम के भाग के लिए, एक अनूठा साथ में जो कि प्रपत्र एचटीएमएल, पहचानकर्ता डेमो घोषित किया गया है. और इसलिए हम पर अमल करने की कोशिश कर रहे हैं मेरे कि नोड से पहले जावा स्क्रिप्ट कोड भी जाहिर है, जो पेड़ में मौजूद है समस्याग्रस्त है, तो, निश्चित रूप से, क्योंकि तत्व ही रिक्त हो जाएगा समय में उस बिंदु पर. 

तो कैसे ठीक करने के लिए? वैसे तो हम समाधान की एक जोड़ी है. लेकिन स्थानांतरित द्वारा सरल सा प्रयास सिर से मेरी स्क्रिप्ट टैग की ओर, विशेष रूप से मेरे शरीर के लिए टैग, लेकिन मेरे पृष्ठ के शरीर के नीचे तो यह नोड्स नीचे है कि और सवाल. विशेष रूप से, के उजागर करते हैं और कटौती खुले टैग और स्क्रिप्ट के लिए करीब टैग और कोड की है कि पूरे ब्लॉक स्थानांतरित यहाँ फ़ाइल के नीचे करने के लिए. 

अब यह जरूरी साफ नहीं है डिजाइन, लेकिन कम से कम यह होगा आपरेशन के अधिकार के आदेश को लागू. की फाइल को बचाने करते हैं और अपने ब्राउज़र में फिर से लोड. पृष्ठ को फिर से लोड करते हैं, फिर से इनपुट मेरा नाम, और वहाँ, नमस्ते डेविड वापस आ गया है.