Q1. (a) नीचे दिखाए अनुसार वेबपेज बनाने के लिए HTML कोड लिखें: 5 Password : [input] Course Code: [BCS-053 v] (b) CSS का क्या उपयोग है? एक उदाहरण की सहायता से समझाइए। 3 (c) JSP के पेज डायरेक्टिव एलिमेंट को सिंटैक्स के साथ समझाइए। 2 (d) HTML सोर्स कोड में एम्बेडेड getElementById() मेथड के उपयोग को समझाइए। 2 (e) JDBC क्या है? डेटाबेस की स्टूडेंट टेबल में एक रिकॉर्ड डालने के लिए एक JSP प्रोग्राम लिखें। यदि कोई हो, तो उपयुक्त धारणा बनाएं और बताएं। 5 (f) कुकी क्या है? ‘txtcookie’ नाम की एक नई कुकी बनाने के लिए कमांड लिखें। इस कुकी का जीवनकाल 5 मिनट तक सेट करने के लिए एक कमांड भी लिखें। 3

Ans. (a) नीचे दिए गए वेबपेज को बनाने के लिए HTML कोड इस प्रकार है:

यह कोड एक पासवर्ड इनपुट फ़ील्ड और एक ड्रॉप-डाउन मेनू के साथ एक फॉर्म बनाता है। “`html

Student Form

Student Information

Password :

Course Code:

BCS-053

BCS-054

BCS-055

“` (b) CSS का पूरा नाम कैस्केडिंग स्टाइल शीट्स (Cascading Style Sheets) है। इसका मुख्य उपयोग HTML या XML जैसे मार्कअप भाषा में लिखे गए दस्तावेज़ की प्रस्तुति (presentation) और स्टाइलिंग को परिभाषित करना है। CSS कंटेंट (HTML) को प्रेजेंटेशन (CSS) से अलग करता है।

इसके उपयोग निम्नलिखित हैं:

• यह वेब पेजों के लेआउट, रंग, फ़ॉन्ट और स्पेसिंग को नियंत्रित करता है।
• यह एक स्टाइल शीट को कई वेब पेजों पर लागू करने की अनुमति देता है, जिससे रखरखाव आसान हो जाता है।
• यह विभिन्न डिवाइसों (डेस्कटॉप, टैबलेट, मोबाइल) के लिए रेस्पॉन्सिव डिज़ाइन बनाने में मदद करता है।

उदाहरण: मान लीजिए हमारे पास निम्नलिखित HTML है: “`html Welcome to IGNOU

This is a web programming course. “` हम निम्नलिखित CSS का उपयोग करके इसकी स्टाइल बदल सकते हैं: “`css h1 { color: blue; text-align: center; } p { font-family: Arial, sans-serif; font-size: 16px; } “` यह CSS `h1` एलिमेंट के टेक्स्ट को नीला और केंद्र में संरेखित करेगा, और `p` एलिमेंट के फ़ॉन्ट को Arial और आकार को 16 पिक्सेल पर सेट करेगा। (c) JSP में, पेज डायरेक्टिव (`<%@ page … %>`) पूरे JSP पेज पर लागू होने वाले निर्देशों को परिभाषित करता है। यह JSP कंटेनर को बताता है कि पेज का अनुवाद और निष्पादन कैसे करें।

सिंटैक्स: `<%@ page attribute1=”value1″ attribute2=”value2″ … %>`

मुख्य एट्रिब्यूट्स:

• import : जावा क्लास को इम्पोर्ट करने के लिए। जैसे: `import=”java.util.Date”`।
• contentType : रिस्पांस के MIME प्रकार और करैक्टर एन्कोडिंग को सेट करने के लिए। जैसे: `contentType=”text/html; charset=UTF-8″`।
• session : पेज को HTTP सेशन में भाग लेने की अनुमति देने के लिए (`true` या `false`)।
• errorPage : यदि इस पेज पर कोई अपवाद (exception) होता ہے तो किस पेज पर रीडायरेक्ट करना है।

(d) `getElementById()` जावास्क्रिप्ट में `document` ऑब्जेक्ट का एक मेथड है। इसका उपयोग HTML डॉक्यूमेंट में किसी विशेष एलिमेंट को उसके अद्वितीय `id` एट्रिब्यूट के माध्यम से एक्सेस करने के लिए किया जाता है।

जब इस मेथड को एक `id` मान के साथ कॉल किया जाता है, तो यह पूरे डॉक्यूमेंट ऑब्जेक्ट मॉडल (DOM) में उस `id` वाले एलिमेंट को खोजता है और उस एलिमेंट के ऑब्जेक्ट को लौटाता है। यदि कोई एलिमेंट नहीं मिलता है, तो यह `null` लौटाता है।

उदाहरण: “`html Hello World! “` इस उदाहरण में, जावास्क्रिप्ट `p` टैग को उसके `id` “demo” से ढूंढता है और उसके टेक्स्ट को बदल देता है। (e) JDBC का पूरा नाम जावा डेटाबेस कनेक्टिविटी (Java Database Connectivity) है। यह एक जावा एपीआई (API) है जो परिभाषित करता है कि एक जावा एप्लिकेशन डेटाबेस तक कैसे पहुंच सकता है। यह रिलेशनल डेटाबेस से डेटा क्वेरी करने और अपडेट करने के लिए मेथड प्रदान करता है। JDBC ड्राइवर का उपयोग करके, जावा विभिन्न प्रकार के डेटाबेस (जैसे MySQL, Oracle, PostgreSQL) से जुड़ सकता है।

धारणाएं:

• डेटाबेस का नाम: `my_db`
• टेबल का नाम: `student`
• टेबल के कॉलम: `enrollment_no` (VARCHAR), `name` (VARCHAR), `course_code` (VARCHAR)
• MySQL JDBC ड्राइवर क्लास पाथ में मौजूद है।
• डेटाबेस चल रहा है और `jdbc:mysql://localhost:3306/my_db` पर उपलब्ध है।

रिकॉर्ड डालने के लिए JSP प्रोग्राम: “`jsp <%@ page import=”java.sql.*” %>

Insert Record

<% // रिकॉर्ड करने के लिए डेटा String enr_no = “123456789”; String studentName = “Ravi Kumar”; String course = “BCS-053”; Connection conn = null; PreparedStatement pstmt = null; try { // 1. JDBC ड्राइवर लोड करें Class.forName(“com.mysql.cj.jdbc.Driver”); // 2. कनेक्शन स्थापित करें conn = DriverManager.getConnection(“jdbc:mysql://localhost:3306/my_db”, “root”, “password”); // 3. SQL INSERT स्टेटमेंट बनाएं String sql = “INSERT INTO student (enrollment_no, name, course_code) VALUES (?, ?, ?)”; pstmt = conn.prepareStatement(sql); // 4. पैरामीटर सेट करें pstmt.setString(1, enr_no); pstmt.setString(2, studentName); pstmt.setString(3, course); // 5. स्टेटमेंट निष्पादित करें int rowsAffected = pstmt.executeUpdate(); if (rowsAffected > 0) { out.println(” Record inserted successfully! “); } else { out.println(” Failed to insert record. “); } } catch (Exception e) { e.printStackTrace(new java.io.PrintWriter(out)); } finally { // 6. संसाधन बंद करें if (pstmt != null) try { pstmt.close(); } catch (SQLException ignore) {} if (conn != null) try { conn.close(); } catch (SQLException ignore) {} } %>

“` (f) एक कुकी (Cookie) डेटा का एक छोटा टुकड़ा है जिसे एक वेबसाइट उपयोगकर्ता के वेब ब्राउज़र के माध्यम से उपयोगकर्ता के कंप्यूटर पर संग्रहीत करती है। इसका उपयोग सेशन प्रबंधन, वैयक्तिकरण (personalization) और उपयोगकर्ता ट्रैकिंग के लिए किया जाता है। जब उपयोगकर्ता उसी वेबसाइट पर वापस जाता है, तो ब्राउज़र कुकी को सर्वर पर वापस भेजता है।

‘txtcookie’ नाम की एक नई कुकी बनाने के लिए कमांड (JSP/Servlet में):

यह कमांड एक कुकी ऑब्जेक्ट बनाता है जिसका नाम ‘txtcookie’ और मान ‘someValue’ है। “`java Cookie newCookie = new Cookie(“txtcookie”, “someValue”); “` इस कुकी का जीवनकाल 5 मिनट तक सेट करने के लिए कमांड:

`setMaxAge()` मेथड सेकंड में समय लेता है, इसलिए 5 मिनट के लिए हमें 5 * 60 = 300 सेकंड सेट करना होगा। “`java newCookie.setMaxAge(5 * 60); “` अंत में, इस कुकी को उपयोगकर्ता के ब्राउज़र पर भेजने के लिए, इसे `response` ऑब्जेक्ट में जोड़ा जाना चाहिए: “`java response.addCookie(newCookie); “`

Q2. (a) WML क्या है? एक छात्र का विवरण प्रदर्शित करने के लिए WML प्रोग्राम डिज़ाइन करें, जिसमें एनरोलमेंट नंबर, नाम, प्रोग्राम कोड और कोर्स कोड जैसे एट्रिब्यूट्स हों। 5 (b) एक आरेख की सहायता से JSP जीवन चक्र की व्याख्या करें। 5

Ans. (a) WML का पूरा नाम वायरलेस मार्कअप लैंग्वेज (Wireless Markup Language) है। यह एक XML-आधारित मार्कअप भाषा है जिसका उपयोग ऐसे वेब पेज बनाने के लिए किया जाता है जिन्हें WAP (वायरलेस एप्लिकेशन प्रोटोकॉल) ब्राउज़र पर प्रदर्शित किया जा सकता है, जैसे कि पुराने फीचर फोन पर।

WML की संरचना डेक (Decks) और कार्ड (Cards) पर आधारित है। एक डेक एक पूर्ण WML दस्तावेज़ है, और एक कार्ड उपयोगकर्ता के लिए इंटरैक्शन की एक एकल इकाई है (एक स्क्रीन के बराबर)। उपयोगकर्ता एक ही डेक के भीतर विभिन्न कार्डों के बीच नेविगेट कर सकता है, जिससे सर्वर पर बार-बार अनुरोध करने की आवश्यकता कम हो जाती है।

छात्र विवरण प्रदर्शित करने के लिए WML प्रोग्राम:

यह प्रोग्राम एक कार्ड के साथ एक डेक बनाता है जो छात्र के विवरण को शीर्षक और पैराग्राफ में दिखाता है। “`xml “http://www.wapforum.org/DTD/wml_1.1.xml”>

Student Information:

Enrolment Number: 210123456

Name: Anjali Sharma

Program Code: BCA

Course Code: BCS-053

“` इस कोड को `.wml` एक्सटेंशन के साथ सहेजा जाएगा और WAP ब्राउज़र या एमुलेटर में देखा जा सकता है। (b) JSP (जावा सर्वर पेज) जीवन चक्र उन चरणों का वर्णन करता है जिनसे एक JSP पेज अपनी रचना से लेकर विनाश तक गुजरता है। JSP कंटेनर (जैसे अपाचे टॉमकैट) इन चरणों का प्रबंधन करता है। JSP जीवन चक्र में निम्नलिखित चरण होते हैं:

1. अनुवाद (Translation): जब किसी JSP पेज के लिए पहला अनुरोध आता है, तो JSP कंटेनर `.jsp` फ़ाइल को एक जावा सर्वलेट स्रोत फ़ाइल ( `.java` फ़ाइल) में अनुवादित करता है।
2. संकलन (Compilation): कंटेनर फिर उत्पन्न सर्वलेट स्रोत फ़ाइल को जावा बाइटकोड ( `.class` फ़ाइल) में संकलित करता है।
3. लोडिंग (Class Loading): संकलित `.class` फ़ाइल को कंटेनर द्वारा मेमोरी में लोड किया जाता है।
4. इंस्टेंशिएशन (Instantiation): कंटेनर सर्वलेट क्लास का एक उदाहरण (ऑब्जेक्ट) बनाता है।
5. आरंभीकरण (Initialization): कंटेनर सर्वलेट इंस्टेंस पर `jspInit()` मेथड को कॉल करता है। यह मेथड पूरे जीवनकाल में केवल एक बार कॉल किया जाता है। इसका उपयोग डेटाबेस कनेक्शन या अन्य एकमुश्त सेटअप कार्यों को आरंभ करने के लिए किया जा सकता है।
6. अनुरोध प्रसंस्करण (Request Processing): प्रत्येक क्लाइंट अनुरोध के लिए, कंटेनर सर्वलेट पर `_jspService()` मेथड को कॉल करता है। यह मेथड अनुरोध को संसाधित करता है और क्लाइंट को प्रतिक्रिया उत्पन्न करता है। यह चरण जीवन चक्र का मुख्य भाग है और कई बार निष्पादित होता है।
7. विनाश (Destruction): जब JSP पेज को सेवा से हटा दिया जाता है (जैसे जब वेब एप्लिकेशन बंद हो जाता है), तो कंटेनर `jspDestroy()` मेथड को कॉल करता है। यह मेथड जीवनकाल में केवल एक बार कॉल किया जाता है और इसका उपयोग संसाधनों, जैसे डेटाबेस कनेक्शन, को जारी करने के लिए किया जाता है।

JSP जीवन चक्र का आरेख:

[JSP Page (.jsp)] –> Translation –> [Servlet Source (.java)] –> Compilation –> [Servlet Class (.class)] –> Loading & Instantiation –> [Servlet Instance] –(एक बार)–> Initialization (`jspInit()`) –> Request Processing (`_jspService()`) <– [Client Request] –> [Response to Client] –(लूप)–> (अगले अनुरोध के लिए `_jspService()` पर वापस) –> Destruction (`jspDestroy()`) –(जब एप्लिकेशन बंद होता है)

Q3. (a) वेब एप्लिकेशन की 3-स्तरीय वास्तुकला में प्रत्येक स्तर की भूमिका की व्याख्या करें। 3 (b) वर्तमान तिथि और समय प्रिंट करने के लिए एक JSP प्रोग्राम लिखें। 3 (c) निम्नलिखित के बीच अंतर करें: 4 (i) <jsp : include> और <jsp : forward> (ii) Get और Post मेथड

Ans. (a) 3-स्तरीय वास्तुकला (3-Tier Architecture) एक सॉफ्टवेयर एप्लिकेशन आर्किटेक्चर है जो एप्लिकेशन को तीन तार्किक और भौतिक कंप्यूटिंग स्तरों में विभाजित करता है: प्रेजेंटेशन टियर, लॉजिक टियर और डेटा टियर।

1. प्रेजेंटेशन टियर (Presentation Tier): यह शीर्ष-स्तरीय टियर है और उपयोगकर्ता के साथ सीधे इंटरैक्ट करता है। इसकी मुख्य भूमिका उपयोगकर्ता को जानकारी प्रदर्शित करना और उपयोगकर्ता से इनपुट एकत्र करना है। वेब अनुप्रयोगों में, यह आमतौर पर एक वेब ब्राउज़र होता है जो HTML, CSS और जावास्क्रिप्ट को प्रस्तुत करता है। यह टियर उपयोगकर्ता इंटरफ़ेस (UI) के लिए जिम्मेदार है।
2. लॉजिक टियर (Logic Tier / Application Tier): यह मध्य टियर है। यह प्रेजेंटेशन टियर से प्राप्त अनुरोधों को संसाधित करता है, व्यावसायिक तर्क (business logic) को लागू करता है, और डेटा टियर के साथ संचार करके आवश्यक डेटा प्राप्त या संग्रहीत करता है। यह एप्लिकेशन का “मस्तिष्क” है। वेब अनुप्रयोगों में, यह एक वेब सर्वर पर चलने वाले JSP, सर्वलेट्स, या अन्य सर्वर-साइड प्रौद्योगिकियों द्वारा कार्यान्वित किया जाता है।
3. डेटा टियर (Data Tier): यह टियर डेटा के भंडारण और प्रबंधन के लिए जिम्मेदार है। इसमें डेटाबेस सर्वर होता है जो डेटा को संग्रहीत, पुनर्प्राप्त और अद्यतन करता है। लॉजिक टियर इस टियर को डेटा के लिए क्वेरी भेजता है। इस टियर का मुख्य लाभ यह है कि डेटा को एप्लिकेशन और प्रेजेंटेशन लॉजिक से स्वतंत्र रूप से प्रबंधित किया जा सकता है। उदाहरण: MySQL, Oracle, MongoDB सर्वर।

(b) वर्तमान तिथि और समय को प्रिंट करने के लिए JSP प्रोग्राम बहुत सरल है। हम `java.util.Date` क्लास का उपयोग कर सकते हैं और इसे JSP एक्सप्रेशन टैग `<%= … %>` का उपयोग करके सीधे आउटपुट कर सकते हैं।

JSP प्रोग्राम: “`jsp <%@ page import=”java.util.Date, java.text.SimpleDateFormat” %>

Current Date and Time

JSP Current Date and Time

Using java.util.Date: <%= new Date() %>

<%– बेहतर फॉर्मेटिंग के लिए SimpleDateFormat का उपयोग करना –%> Formatted Date and Time: <% Date currentDate = new Date(); SimpleDateFormat formatter = new SimpleDateFormat(“dd-MM-yyyy HH:mm:ss a”); String formattedDate = formatter.format(currentDate); out.println(formattedDate); %>

“` पहला उदाहरण `Date` ऑब्जेक्ट का डिफ़ॉल्ट स्ट्रिंग प्रतिनिधित्व प्रिंट करता है। दूसरा उदाहरण `SimpleDateFormat` का उपयोग करके दिनांक और समय को एक विशिष्ट, पठनीय प्रारूप (`dd-MM-yyyy HH:mm:ss a`) में प्रदर्शित करता है। (c) (i)

• प्रवाह नियंत्रण (Control Flow):
  • <jsp:include>: यह किसी अन्य संसाधन (जैसे JSP, HTML) की सामग्री को वर्तमान JSP पेज में शामिल करता है। शामिल संसाधन के निष्पादन के बाद, नियंत्रण वापस मूल JSP पेज पर लौट आता है, जो अपना निष्पादन जारी रखता है।
  • <jsp:forward>: यह अनुरोध को एक JSP पेज से दूसरे संसाधन पर पूरी तरह से अग्रेषित (forward) करता है। नियंत्रण मूल JSP पेज पर वापस नहीं लौटता है।
• प्रतिक्रिया (Response):
  • <jsp:include>: मूल JSP और शामिल JSP दोनों मिलकर अंतिम प्रतिक्रिया उत्पन्न करते हैं।
  • <jsp:forward>: केवल अग्रेषित संसाधन ही प्रतिक्रिया उत्पन्न करने के लिए जिम्मेदार होता है। मूल JSP का कोई भी आउटपुट जो बफर में होता है, अग्रेषित करने से पहले साफ़ कर दिया जाता है।
• उपयोग का मामला (Use Case):
  • <jsp:include>: पुन: प्रयोज्य पेज घटकों, जैसे हेडर, फुटर या नेविगेशन बार, को शामिल करने के लिए उपयोग किया जाता है।
  • <jsp:forward>: अनुरोध को किसी अन्य पेज पर संसाधित करने के लिए निर्देशित करने के लिए उपयोग किया जाता है, जैसे लॉगिन के बाद उपयोगकर्ता को डैशबोर्ड पर भेजना।

(ii) GET और POST मेथड में अंतर

• डेटा भेजना:
  • GET: फॉर्म डेटा को URL में नाम/मान जोड़े के रूप में संलग्न करता है। (जैसे: `…/page.jsp?name=amit&age=25`)।
  • POST: फॉर्म डेटा को HTTP अनुरोध के बॉडी के भीतर भेजता है।
• डेटा सीमा:
  • GET: भेजे जा सकने वाले डेटा की मात्रा सीमित है (URL की लंबाई सीमा के कारण, आमतौर पर लगभग 2048 वर्ण)।
  • POST: डेटा भेजने की कोई सीमा नहीं है।
• सुरक्षा:
  • GET: कम सुरक्षित है क्योंकि डेटा URL में दिखाई देता है, और यह ब्राउज़र इतिहास और सर्वर लॉग में संग्रहीत हो जाता है। संवेदनशील डेटा के लिए इसका उपयोग नहीं किया जाना चाहिए।
  • POST: अधिक सुरक्षित है क्योंकि डेटा URL में दिखाई नहीं देता है।
• बुकमार्क और इडेम्पोटेंस (Idempotency):
  • GET: अनुरोधों को बुकमार्क किया जा सकता है। यह इडेम्पोटेंट है, जिसका अर्थ है कि एक ही अनुरोध को कई बार करने से कोई अलग प्रभाव नहीं पड़ेगा।
  • POST: अनुरोधों को बुकमार्क नहीं किया जा सकता है। यह इडेम्पोटेंट नहीं है; एक ही अनुरोध को फिर से सबमिट करने से डुप्लिकेट रिकॉर्ड बन सकते हैं।

Q4. (a) JSP में सेशन मैनेजमेंट क्या है? विभिन्न सेशन ट्रैकिंग विधियों की व्याख्या करें। 5 (b) HTML के संदर्भ में डॉक्यूमेंट ऑब्जेक्ट मॉडल का क्या अर्थ है? जावास्क्रिप्ट और HTML का उपयोग करके एक प्रोग्राम लिखें जो एक पैराग्राफ टेक्स्ट को ‘IGNOU’ से ‘Welcome in IGNOU’ में बदलता है। 5

Ans. (a) JSP में सेशन मैनेजमेंट (Session Management) एक वेब एप्लिकेशन के साथ उपयोगकर्ता के इंटरैक्शन को कई HTTP अनुरोधों में बनाए रखने की प्रक्रिया है। चूंकि HTTP एक स्टेटलेस प्रोटोकॉल है, प्रत्येक अनुरोध स्वतंत्र होता है। सेशन मैनेजमेंट सर्वर को उपयोगकर्ता की पहचान, उसकी गतिविधियों (जैसे शॉपिंग कार्ट में आइटम), और अन्य जानकारी को याद रखने की अनुमति देता है जब उपयोगकर्ता साइट के विभिन्न पेजों पर नेविगेट करता है।

विभिन्न सेशन ट्रैकिंग विधियाँ (Session Tracking Methods):

1. कुकीज़ (Cookies): यह सबसे आम तरीका है। सर्वर उपयोगकर्ता के ब्राउज़र को एक छोटी टेक्स्ट फ़ाइल (कुकी) भेजता है जिसमें एक अद्वितीय सेशन आईडी होती है। ब्राउज़र इस कुकी को संग्रहीत करता है और प्रत्येक बाद के अनुरोध के साथ सर्वर को वापस भेजता है। सर्वर इस आईडी का उपयोग उपयोगकर्ता के सेशन डेटा को पुनर्प्राप्त करने के लिए करता है।
2. URL पुनर्लेखन (URL Rewriting): यदि उपयोगकर्ता का ब्राउज़र कुकीज़ को अक्षम कर देता है, तो सेशन आईडी को वेबसाइट के प्रत्येक URL के अंत में मैन्युअल रूप से जोड़ा जा सकता है। उदाहरण: `page.jsp;jsessionid=12345ABCDE`। यह विधि कम सुरक्षित है और URL को जटिल बना देती है।
3. छिपे हुए फॉर्म फ़ील्ड (Hidden Form Fields): सेशन आईडी को एक HTML फॉर्म में एक छिपे हुए इनपुट फ़ील्ड (` `) का उपयोग करके संग्रहीत किया जा सकता है। जब उपयोगकर्ता फॉर्म जमा करता है, तो सेशन आईडी सर्वर को भेजी जाती है। यह विधि केवल उन पेजों के अनुक्रम के लिए काम करती है जो फॉर्म सबमिशन पर निर्भर करते हैं।
4. HTTPSession ऑब्जेक्ट: यह JSP/Servlet API द्वारा प्रदान की गई एक उच्च-स्तरीय, सर्वर-साइड विधि है। JSP कंटेनर स्वचालित रूप से एक `HttpSession` ऑब्जेक्ट बनाता है और प्रत्येक उपयोगकर्ता के लिए इसे प्रबंधित करता है। डेवलपर `session.setAttribute()` और `session.getAttribute()` मेथड का उपयोग करके इस ऑब्जेक्ट में डेटा स्टोर और पुनर्प्राप्त कर सकता है। आंतरिक रूप से, कंटेनर सेशन को ट्रैक करने के लिए कुकीज़ (डिफ़ॉल्ट रूप से) या URL पुनर्लेखन का उपयोग करता है। यह JSP में सेशन प्रबंधन का सबसे पसंदीदा और आसान तरीका है।

(b) डॉक्यूमेंट ऑब्जेक्ट मॉडल (DOM) HTML, XHTML, या XML दस्तावेज़ों के लिए एक प्रोग्रामिंग इंटरफ़ेस है। यह एक दस्तावेज़ की तार्किक संरचना को एक ट्री (tree) के रूप में प्रस्तुत करता है। इस ट्री में प्रत्येक नोड (node) दस्तावेज़ के एक हिस्से का प्रतिनिधित्व करता है, जैसे कि एक एलिमेंट, एक एट्रिब्यूट, या टेक्स्ट।

HTML के संदर्भ में, DOM ब्राउज़र को एक वेब पेज को ऑब्जेक्ट्स के एक पदानुक्रम के रूप में देखने की अनुमति देता है। जावास्क्रिप्ट जैसी स्क्रिप्टिंग भाषाएं इस मॉडल का उपयोग किसी दस्तावेज़ की सामग्री, संरचना और शैली को गतिशील रूप से एक्सेस करने और हेरफेर करने के लिए कर सकती हैं। उदाहरण के लिए, जावास्क्रिप्ट DOM का उपयोग करके एक एलिमेंट का रंग बदल सकता है, एक नया एलिमेंट जोड़ सकता है, या किसी एलिमेंट की सामग्री को संशोधित कर सकता है।

जावास्क्रिप्ट और HTML का उपयोग करके प्रोग्राम:

यह प्रोग्राम एक पैराग्राफ और एक बटन बनाता है। जब बटन पर क्लिक किया जाता है, तो एक जावास्क्रिप्ट फ़ंक्शन पैराग्राफ के टेक्स्ट को बदल देता है। “`html

DOM Manipulation Example

DOM Example

IGNOU

Change Text

“` इस कोड में:

• `

  IGNOU

  ` वह एलिमेंट है जिसे हम बदलना चाहते हैं।

• ` ` एक बटन बनाता है जो क्लिक होने पर `changeText()` फ़ंक्शन को कॉल करता है।
• `changeText()` फ़ंक्शन `document.getElementById()` का उपयोग करके पैराग्राफ को ढूंढता है और फिर उसके टेक्स्ट को बदलने के लिए `.innerHTML` प्रॉपर्टी का उपयोग करता है।

Q5. निम्नलिखित में से किन्हीं चार की व्याख्या उदाहरण/आरेख की सहायता से करें, यदि आवश्यक हो: 4×2.5 = 10 (a) WML घटक (b) XML स्कीमा (c) JDBC-ODBC ब्रिज (d) डिप्लॉयमेंट डिस्क्रिप्टर (e) <detail> और <summary> टैग का उपयोग

Ans. (a) WML (वायरलेस मार्कअप लैंग्वेज) घटक

WML दस्तावेज़ों को बनाने के लिए कई मुख्य घटकों का उपयोग करता है, जो WAP-सक्षम उपकरणों के लिए डिज़ाइन किए गए हैं।

• डेक (Deck): एक WML दस्तावेज़ का मूल तत्व ` ` होता है, जिसे डेक कहा जाता है। एक डेक में एक या अधिक कार्ड होते हैं। सर्वर से एक ही अनुरोध में पूरा डेक डिवाइस पर डाउनलोड हो जाता है।
• कार्ड (Card): एक कार्ड (` `) उपयोगकर्ता के लिए बातचीत की एक एकल इकाई है, जो एक स्क्रीन पर प्रदर्शित होने वाली जानकारी के समान है। उपयोगकर्ता सर्वर से दोबारा संपर्क किए बिना एक ही डेक के भीतर कार्डों के बीच नेविगेट कर सकता है। “`xml

  This is the first card.

  This is the second card.

  “`

• इवेंट्स (Events): ये क्रियाओं को ट्रिगर करते हैं। सामान्य इवेंट्स में `onenterforward` (जब उपयोगकर्ता कार्ड में प्रवेश करता है) और `ontimer` (एक निश्चित समय के बाद) शामिल हैं।
• टास्क (Tasks): ये वे क्रियाएं हैं जो किसी इवेंट के होने पर की जाती हैं। उदाहरण के लिए, ` ` किसी अन्य कार्ड या URL पर नेविगेट करता है, ` ` पिछले कार्ड पर जाता है, और ` ` चरों को अपडेट करता है।

(b) XML स्कीमा (XML Schema)

XML स्कीमा, जिसे अक्सर XSD (XML स्कीमा परिभाषा) कहा जाता है, एक XML दस्तावेज़ की संरचना और सामग्री को परिभाषित करने का एक तरीका है। यह DTD (डॉक्यूमेंट टाइप डेफिनिशन) का एक अधिक शक्तिशाली और लचीला विकल्प है।

उद्देश्य:

• यह परिभाषित करता है कि XML दस्तावेज़ में कौन से एलिमेंट और एट्रिब्यूट दिखाई दे सकते हैं।
• यह एलिमेंट्स का क्रम, उनकी संख्या और उनके डेटा प्रकार (जैसे स्ट्रिंग, इंटीजर, डेट) को निर्दिष्ट करता है।
• यह XML दस्तावेज़ की वैधता को सत्यापित करने के लिए एक “ब्लूप्रिंट” के रूप में कार्य करता है।

उदाहरण: मान लीजिए हमारे पास यह XML है: “`xml

Amit

101

“` इसके लिए एक सरल XSD इस प्रकार होगा: “`xml

“` यह स्कीमा निर्दिष्ट करता है कि ` ` एलिमेंट में एक ` ` (स्ट्रिंग) और उसके बाद एक ` ` (इंटीजर) होना चाहिए। (c) JDBC-ODBC ब्रिज

JDBC-ODBC ब्रिज एक टाइप 1 JDBC ड्राइवर है जो JDBC API कॉल को ODBC (ओपन डेटाबेस कनेक्टिविटी) कॉल में अनुवादित करता है। यह जावा अनुप्रयोगों को किसी भी ऐसे डेटाबेस से कनेक्ट करने की अनुमति देता है जिसके लिए ODBC ड्राइवर उपलब्ध है।

कार्यप्रणाली का आरेख:

`[जावा एप्लिकेशन] -> [JDBC API] -> [JDBC-ODBC ब्रिज ड्राइवर] -> [ODBC ड्राइवर] -> [डेटाबेस]`

उपयोग: यह तब उपयोगी था जब सभी डेटाबेस के लिए शुद्ध जावा JDBC ड्राइवर उपलब्ध नहीं थे। डेवलपर्स किसी भी डेटाबेस से जुड़ने के लिए मौजूदा ODBC ड्राइवरों का लाभ उठा सकते थे।

नुकसान और वर्तमान स्थिति:

यह प्रदर्शन में धीमा है क्योंकि इसमें JDBC से ODBC में अनुवाद की एक अतिरिक्त परत होती है।

क्लाइंट मशीन पर ODBC ड्राइवर की स्थापना और कॉन्फ़िगरेशन की आवश्यकता होती है।

इसे Java SE 8 से हटा दिया गया है और अब इसे अप्रचलित माना जाता है। आधुनिक अनुप्रयोगों को सीधे डेटाबेस विक्रेता द्वारा प्रदान किए गए टाइप 4 (शुद्ध जावा) ड्राइवरों का उपयोग करना चाहिए।

(d) डिप्लॉयमेंट डिस्क्रिप्टर (Deployment Descriptor)

डिप्लॉयमेंट डिस्क्रिप्टर एक जावा वेब एप्लिकेशन के लिए एक कॉन्फ़िगरेशन फ़ाइल है, जिसका नाम `web.xml` है। यह एप्लिकेशन के `WEB-INF/` डायरेक्टरी में स्थित होती है।

उद्देश्य: यह सर्वलेट कंटेनर (जैसे टॉमकैट) को बताता है कि वेब एप्लिकेशन को कैसे तैनात और कॉन्फ़िगर करना है। यह एप्लिकेशन के विभिन्न घटकों और सेटिंग्स को परिभाषित करता है।

`web.xml` में परिभाषित मुख्य तत्व:

सर्वलेट घोषणाएँ और मैपिंग: ` ` और ` ` टैग का उपयोग करके सर्वलेट को कॉन्फ़िगर करना।

स्वागत फ़ाइलें (Welcome Files): ` ` जो एप्लिकेशन के रूट URL पर अनुरोध करने पर दिखाई जाने वाली डिफ़ॉल्ट फ़ाइल को निर्दिष्ट करता है।

सेशन कॉन्फ़िगरेशन: ` ` का उपयोग करके सेशन टाइमआउट सेट करना।

त्रुटि पृष्ठ (Error Pages): ` ` जो विशिष्ट HTTP त्रुटियों या अपवादों के लिए कस्टम त्रुटि पृष्ठों को मैप करता है।

फ़िल्टर (Filters): ` ` और ` ` का उपयोग करके अनुरोधों और प्रतिक्रियाओं को इंटरसेप्ट करने के लिए फ़िल्टर को कॉन्फ़िगर करना।

Servlet 3.0 और बाद के संस्करणों में, एनोटेशन (जैसे `@WebServlet`) का उपयोग `web.xml` की आवश्यकता को कम कर सकता है, लेकिन यह अभी भी जटिल कॉन्फ़िगरेशन के लिए उपयोग किया जाता है। (e)

ये HTML5 में पेश किए गए सिमेंटिक टैग हैं जिनका उपयोग एक “डिस्क्लोजर विजेट” या “अकॉर्डियन” बनाने के लिए किया जाता है, जहाँ उपयोगकर्ता सामग्री को दिखा या छिपा सकता है।

` ` टैग: यह विजेट के लिए कंटेनर है। इस टैग के अंदर की सामग्री (जो ` ` टैग के बाहर है) डिफ़ॉल्ट रूप से छिपी होती है।

` ` टैग: यह ` ` विजेट के लिए एक दृश्यमान शीर्षक प्रदान करता है। जब उपयोगकर्ता इस शीर्षक पर क्लिक करता है, तो ` ` टैग की शेष सामग्री की दृश्यता टॉगल हो जाती है (दिखाई/छिप जाती है)।

यह अक्सर FAQ (अक्सर पूछे जाने वाले प्रश्न) सेक्शन बनाने के लिए उपयोग किया जाता है।

उदाहरण: “`html

What is Web Programming?

Web Programming refers to the writing, markup and coding involved in Web development, which includes Web content, Web client and server scripting and network security.

What are the core technologies?

HTML

CSS

JavaScript

“` इस उदाहरण में, उपयोगकर्ता प्रश्नों (` ` टेक्स्ट) पर क्लिक करके उत्तरों (` ` या ` `) को देख या छिपा सकता है। `open` एट्रिब्यूट का उपयोग करके एक ` ` एलिमेंट को डिफ़ॉल्ट रूप से खुला बनाया जा सकता है: ` … `।