DHTML in Hindi
DIPLOMA_CSE / Web Technology
Core Concepts of DHTML in Hindi
DHTML in Hindi
DHTML (Dynamic HTML) рдПрдХ рд╡реЗрдм рддрдХрдиреАрдХ рд╣реИ, рдЬреЛ HTML, CSS, рдФрд░ JavaScript рдХрд╛ рд╕рдВрдпреЛрдЬрди рдХрд░рдХреЗ рд╡реЗрдм рдкреЗрдЬреЛрдВ рдореЗрдВ рдЗрдВрдЯрд░реИрдХреНрдЯрд┐рд╡ рдФрд░ рдбрд╛рдпрдирд╛рдорд┐рдХ рддрддреНрд╡ рдЬреЛрдбрд╝рдиреЗ рдХреА рдкреНрд░рдХреНрд░рд┐рдпрд╛ рдХреЛ рджрд░реНрд╢рд╛рддреА рд╣реИред рдЗрд╕рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рд╣рдо рдкреЗрдЬ рдХреЛ рдмрд┐рдирд╛ рд░реАрдлреНрд░реЗрд╢ рдХрд┐рдП рд╣реА рд╡рд┐рднрд┐рдиреНрди рддрд░реАрдХреЗ рд╕реЗ рдЕрдкрдбреЗрдЯ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред рдЗрд╕реЗ рд╡реЗрдмрд╕рд╛рдЗрдЯ рдкрд░ рд╡рд┐рдЬрд╝реБрдЕрд▓ рдФрд░ рдЗрдВрдЯрд░реЗрдХреНрд╢рди рдХреЗ рдЕрдиреБрднрд╡ рдХреЛ рдмреЗрд╣рддрд░ рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП рдЗрд╕реНрддреЗрдорд╛рд▓ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред
Core Components of DHTML in Hindi
DHTML рдХреЗ рддреАрди рдореБрдЦреНрдп рдШрдЯрдХ рд╣реЛрддреЗ рд╣реИрдВ, рдЬрд┐рдирдХрд╛ рдЙрдкрдпреЛрдЧ рд╣рдо рд╡реЗрдм рдкреЗрдЬ рдХреЛ рдбрд╛рдпрдирд╛рдорд┐рдХ рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд░рддреЗ рд╣реИрдВ:
- HTML: HTML рд╡реЗрдм рдкреЗрдЬ рдХрд╛ рд╕рдВрд░рдЪрдирд╛ рдмрдирд╛рддрд╛ рд╣реИ, рдЬрд┐рд╕рдореЗрдВ рд╡рд┐рднрд┐рдиреНрди рддрддреНрд╡ (рдЬреИрд╕реЗ , ,
, рдЖрджрд┐) рд╣реЛрддреЗ рд╣реИрдВред
- CSS: CSS рд╡реЗрдм рдкреЗрдЬ рдХреЗ рджреГрд╢реНрдп рдФрд░ рд░реВрдк (styling) рдХреЛ рдирд┐рдпрдВрддреНрд░рд┐рдд рдХрд░рддрд╛ рд╣реИред рдЗрд╕рдХреЗ рджреНрд╡рд╛рд░рд╛ рд╣рдо рд░рдВрдЧ, рдлреЙрдиреНрдЯ, рдЖрдХрд╛рд░, рдФрд░ рд╕реНрдерд╛рди рдХрд╛ рдирд┐рд░реНрдзрд╛рд░рдг рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред
- JavaScript: JavaScript рд╡реЗрдм рдкреЗрдЬ рдореЗрдВ рдХреНрд░рд┐рдпрд╛рддреНрдордХрддрд╛ (functionality) рдЬреЛрдбрд╝рддрд╛ рд╣реИред рдпрд╣ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдЗрдВрдЯрд░рдПрдХреНрд╢рди (рдЬреИрд╕реЗ рдХреНрд▓рд┐рдХ рдХрд░рдирд╛, рдХреАрдмреЛрд░реНрдб рд╕реЗ рдХреБрдЫ рд▓рд┐рдЦрдирд╛) рдХреЗ рдЖрдзрд╛рд░ рдкрд░ рдкреЗрдЬ рдХреА рд╕рд╛рдордЧреНрд░реА рдХреЛ рдмрджрд▓ рд╕рдХрддрд╛ рд╣реИред
How DHTML Works in a Web Page in Hindi
DHTML рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ HTML, CSS рдФрд░ JavaScript рдХреЗ рдЖрдкрд╕реА рд╕рдВрдпреЛрдЬрди рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗред рдЬрдм рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдХрд┐рд╕реА рднреА рдкреЗрдЬ рдкрд░ рдЗрдВрдЯрд░рдПрдХреНрд╢рди рдХрд░рддрд╛ рд╣реИ, рддреЛ JavaScript DOM (Document Object Model) рдХреЗ рдЬрд░рд┐рдП HTML рдФрд░ CSS рдХреЗ рддрддреНрд╡реЛрдВ рдХреЛ рдЕрдкрдбреЗрдЯ рдХрд░рддрд╛ рд╣реИред рдЗрд╕ рдкреНрд░рдХреНрд░рд┐рдпрд╛ рдореЗрдВ рдкреЗрдЬ рдХреА рдкреВрд░реА рд░реА-рд▓реЛрдбрд┐рдВрдЧ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реЛрддреА, рдЬрд┐рд╕рд╕реЗ рдпреВрдЬрд╝рд░ рдХреЛ рдмреЗрд╣рддрд░ рдФрд░ рддреЗрдЬрд╝ рдЕрдиреБрднрд╡ рдорд┐рд▓рддрд╛ рд╣реИред
Dynamic Effects Using DHTML in Hindi
DHTML рдХрд╛ рдореБрдЦреНрдп рдЙрджреНрджреЗрд╢реНрдп рдбрд╛рдпрдирд╛рдорд┐рдХ рдЗрдлреЗрдХреНрдЯреНрд╕ рдХреЛ рд╡реЗрдмрд╕рд╛рдЗрдЯ рдкрд░ рд▓рд╛рдЧреВ рдХрд░рдирд╛ рд╣реИред рдЗрд╕рдХреЗ рджреНрд╡рд╛рд░рд╛ рд╣рдо рд╡реЗрдм рдкреЗрдЬ рдкрд░ рд╡рд┐рднрд┐рдиреНрди рдкреНрд░рдХрд╛рд░ рдХреЗ рдЧрддрд┐рд╢реАрд▓ рдкреНрд░рднрд╛рд╡ рдЬреЛрдбрд╝ рд╕рдХрддреЗ рд╣реИрдВ, рдЬреИрд╕реЗ:
- Visibility Effects: рдХрд┐рд╕реА рддрддреНрд╡ рдХреЛ рджрд┐рдЦрд╛рдирд╛ рдпрд╛ рдЫреБрдкрд╛рдирд╛ред
- Movement Effects: рдХрд┐рд╕реА рддрддреНрд╡ рдХреЛ рдПрдХ рд╕реНрдерд╛рди рд╕реЗ рджреВрд╕рд░реЗ рд╕реНрдерд╛рди рдкрд░ рд▓реЗ рдЬрд╛рдирд╛ред
- Animation Effects: рддрддреНрд╡реЛрдВ рдХреЛ рдзреАрд░реЗ-рдзреАрд░реЗ рдмрджрд▓рдирд╛ рдпрд╛ рдШреВрдорд╛рдирд╛ред
- Mouse Event Effects: рдорд╛рдЙрд╕ рдХреНрд▓рд┐рдХ, рд╣реЛрд╡рд░ рдпрд╛ рдорд╛рдЙрд╕ рдореВрд╡рдореЗрдВрдЯ рдХреЗ рдЖрдзрд╛рд░ рдкрд░ рдЗрдлреЗрдХреНрдЯреНрд╕ред
Simple Examples of DHTML in Hindi
DHTML рдХреЗ рджреНрд╡рд╛рд░рд╛ рд╣рдо рд╕рд░рд▓ рдЙрджрд╛рд╣рд░рдгреЛрдВ рдХреЗ рд░реВрдк рдореЗрдВ рд╡рд┐рднрд┐рдиреНрди рдбрд╛рдпрдирд╛рдорд┐рдХ рдмрджрд▓рд╛рд╡ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП:
Example 1: Changing the Color of a Text on Mouse Hover
<html> <head> <style> .hoverText:hover { color: red; } </style> </head> <body> <p class="hoverText">Hover over this text to change color.</p> </body> </html>
Example 2: Changing Image on Mouse Click
<html> <head> <script> function changeImage() { document.getElementById("image").src = "newImage.jpg"; } </script> </head> <body> <img id="image" src="oldImage.jpg" onclick="changeImage()" /> </body> </html>
Advantages of DHTML in Hindi
DHTML рдХреЗ рдХрдИ рд▓рд╛рдн рд╣реИрдВ, рдЬрд┐рдирдореЗрдВ рд╕реЗ рдХреБрдЫ рдкреНрд░рдореБрдЦ рд▓рд╛рдн рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╣реИрдВ:
- Improved User Experience: DHTML рд╕реЗ рдкреЗрдЬ рдмрд┐рдирд╛ рд░реАрдлреНрд░реЗрд╢ рдХрд┐рдП рдЕрдкрдбреЗрдЯ рд╣реЛ рдЬрд╛рддреЗ рд╣реИрдВ, рдЬрд┐рд╕рд╕реЗ рдпреВрдЬрд╝рд░ рдХрд╛ рдЕрдиреБрднрд╡ рдмреЗрд╣рддрд░ рд╣реЛрддрд╛ рд╣реИред
- Faster Web Pages: рдпрд╣ рддрдХрдиреАрдХ рд╡реЗрдм рдкреЗрдЬ рдХреЛ рддреЗрдЬрд╝ рдмрдирд╛рддреА рд╣реИ, рдХреНрдпреЛрдВрдХрд┐ рдкреЗрдЬ рдХреЛ рдмрд╛рд░-рдмрд╛рд░ рд░реА-рд▓реЛрдб рдирд╣реАрдВ рдХрд░рдирд╛ рдкрдбрд╝рддрд╛ред
- Interactive Web Pages: DHTML рдХрд╛ рдЙрдкрдпреЛрдЧ рдкреЗрдЬ рдкрд░ рдЗрдВрдЯрд░рдПрдХреНрд╢рди рдФрд░ рд╡рд┐рдЬрд╝реБрдЕрд▓ рдЗрдлреЗрдХреНрдЯреНрд╕ рдХреЛ рдЬреЛрдбрд╝рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ, рдЬрд┐рд╕рд╕реЗ рдкреЗрдЬ рдХреЛ рдЖрдХрд░реНрд╖рдХ рдмрдирд╛рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИред
- Less Server Load: рдХреНрдпреЛрдВрдХрд┐ рдкреЗрдЬ рдХреЛ рдмрд╛рд░-рдмрд╛рд░ рд╕рд░реНрд╡рд░ рд╕реЗ рд▓реЛрдб рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛, рдЗрд╕рдХрд╛ рдорддрд▓рдм рд╣реИ рдХрд┐ рд╕рд░реНрд╡рд░ рдкрд░ рдХрдо рд▓реЛрдб рд╣реЛрддрд╛ рд╣реИред
Disadvantages of DHTML in Hindi
DHTML рдХреЗ рдХреБрдЫ рдиреБрдХрд╕рд╛рди рднреА рд╣реЛрддреЗ рд╣реИрдВ, рдЬрд┐рдирдХрд╛ рдзреНрдпрд╛рди рд░рдЦрдирд╛ рдЖрд╡рд╢реНрдпрдХ рд╣реИ:
- Browser Compatibility Issues: рд╕рднреА рдмреНрд░рд╛рдЙрдЬрд╝рд░реЛрдВ рдореЗрдВ DHTML рдПрдХ рдЬреИрд╕рд╛ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ред рдХреБрдЫ рдкреБрд░рд╛рдиреЗ рдмреНрд░рд╛рдЙрдЬрд╝рд░реНрд╕ рдореЗрдВ рдЗрд╕реЗ рдареАрдХ рд╕реЗ рд╕рдкреЛрд░реНрдЯ рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ред
- Complexity: DHTML рдХреЛ рд╕рд╣реА рддрд░реАрдХреЗ рд╕реЗ рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП HTML, CSS, рдФрд░ JavaScript рдХреЗ рдЕрдЪреНрдЫреЗ рдЬреНрдЮрд╛рди рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛрддреА рд╣реИред
- Performance Issues: рдпрджрд┐ рдмрд╣реБрдд рд╕рд╛рд░реЗ рдЬрдЯрд┐рд▓ DHTML рдЗрдлреЗрдХреНрдЯреНрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд┐рдпрд╛ рдЬрд╛рдП, рддреЛ рдпрд╣ рдкреЗрдЬ рдХреА рдЧрддрд┐ рдХреЛ рдзреАрдорд╛ рдХрд░ рд╕рдХрддрд╛ рд╣реИ, рдЦрд╛рд╕рдХрд░ рдкреБрд░рд╛рдиреЗ рдХрдВрдкреНрдпреВрдЯрд░ рдпрд╛ рдмреНрд░рд╛рдЙрдЬрд╝рд░реНрд╕ рдореЗрдВред
- Security Risks: JavaScript рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╕рдордп рдпрджрд┐ рд╕рд╣реА рддрд░реАрдХреЗ рд╕реЗ рдХреЛрдбрд┐рдВрдЧ рдирд╣реАрдВ рдХреА рдЬрд╛рдП, рддреЛ рд╕реБрд░рдХреНрд╖рд╛ рд╕рдорд╕реНрдпрд╛рдПрдВ рдЙрддреНрдкрдиреНрди рд╣реЛ рд╕рдХрддреА рд╣реИрдВред
FAQs
DHTML (Dynamic HTML) рдПрдХ рд╡реЗрдм рддрдХрдиреАрдХ рд╣реИ рдЬреЛ HTML, CSS, рдФрд░ JavaScript рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рд╡реЗрдм рдкреЗрдЬреЛрдВ рдХреЛ рдбрд╛рдпрдирд╛рдорд┐рдХ рдФрд░ рдЗрдВрдЯрд░реИрдХреНрдЯрд┐рд╡ рдмрдирд╛рддреА рд╣реИред рдЗрд╕рдХрд╛ рдореБрдЦреНрдп рдЙрджреНрджреЗрд╢реНрдп рд╡реЗрдм рдкреЗрдЬреЛрдВ рдореЗрдВ рдЧрддрд┐рд╢реАрд▓ рдкреНрд░рднрд╛рд╡ рдФрд░ рдЗрдВрдЯрд░рдПрдХреНрд╢рди рдЬреЛрдбрд╝рдирд╛ рд╣реИред
DHTML рдХреЗ рдореБрдЦреНрдп рдШрдЯрдХ рд╣реИрдВ:
- HTML: рд╡реЗрдм рдкреЗрдЬ рдХреА рд╕рдВрд░рдЪрдирд╛ рдмрдирд╛рддрд╛ рд╣реИред
- CSS: рдкреЗрдЬ рдХреЗ рдбрд┐рдЬрд╝рд╛рдЗрди рдФрд░ рд░реВрдк рдХреЛ рдирд┐рдпрдВрддреНрд░рд┐рдд рдХрд░рддрд╛ рд╣реИред
- JavaScript: рдкреЗрдЬ рдкрд░ рдЗрдВрдЯрд░рдПрдХреНрд╢рди рдФрд░ рдХреНрд░рд┐рдпрд╛рддреНрдордХрддрд╛ рдЬреЛрдбрд╝рддрд╛ рд╣реИред
DHTML рдкреЗрдЬ рдХреЗ рддрддреНрд╡реЛрдВ рдХреЛ рдмрд┐рдирд╛ рд░реАрдлреНрд░реЗрд╢ рдХрд┐рдП рдЕрджреНрдпрддрди рдХрд░рддрд╛ рд╣реИред рдпрд╣ HTML, CSS, рдФрд░ JavaScript рдХреЗ рд╕рдВрдпреЛрдЬрди рд╕реЗ рдкреЗрдЬ рдХреЗ рднреАрддрд░ DOM (Document Object Model) рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдкрд░рд┐рд╡рд░реНрддрди рдХрд░рддрд╛ рд╣реИред
DHTML рдореЗрдВ рдбрд╛рдпрдирд╛рдорд┐рдХ рдЗрдлреЗрдХреНрдЯреНрд╕ рдЙрди рд╡рд┐рдЬрд╝реБрдЕрд▓ рдкреНрд░рднрд╛рд╡реЛрдВ рдХреЛ рдХрд╣рддреЗ рд╣реИрдВ рдЬреЛ рд╡реЗрдм рдкреЗрдЬ рдкрд░ рд╕рдХреНрд░рд┐рдп рд╣реЛрддреЗ рд╣реИрдВ, рдЬреИрд╕реЗ:
- Visibility Effects: рддрддреНрд╡реЛрдВ рдХреЛ рджрд┐рдЦрд╛рдирд╛ рдпрд╛ рдЫреБрдкрд╛рдирд╛ред
- Movement Effects: рддрддреНрд╡реЛрдВ рдХреЛ рд╕реНрдерд╛рдирд╛рдВрддрд░рд┐рдд рдХрд░рдирд╛ред
- Animation Effects: рддрддреНрд╡реЛрдВ рдХреЛ рдзреАрд░реЗ-рдзреАрд░реЗ рдмрджрд▓рдирд╛ред
DHTML рдХреЗ рд▓рд╛рднреЛрдВ рдореЗрдВ рд╢рд╛рдорд┐рд▓ рд╣реИрдВ:
- Improved User Experience: рдмрд┐рдирд╛ рд░реАрдлреНрд░реЗрд╢ рдХрд┐рдП рдкреЗрдЬ рдЕрдкрдбреЗрдЯ рд╣реЛрддреЗ рд╣реИрдВ, рдЬрд┐рд╕рд╕реЗ рдпреВрдЬрд╝рд░ рдЕрдиреБрднрд╡ рдмреЗрд╣рддрд░ рд╣реЛрддрд╛ рд╣реИред
- Faster Web Pages: рдкреЗрдЬ рд▓реЛрдбрд┐рдВрдЧ рдХреА рдЧрддрд┐ рддреЗрдЬ рд╣реЛрддреА рд╣реИред
- Interactive Web Pages: рдкреЗрдЬ рдореЗрдВ рдЗрдВрдЯрд░рдПрдХреНрд╢рди рдФрд░ рдЖрдХрд░реНрд╖рдХ рд╡рд┐рдЬрд╝реБрдЕрд▓ рдкреНрд░рднрд╛рд╡ рд╣реЛрддреЗ рд╣реИрдВред
DHTML рдХреЗ рдиреБрдХрд╕рд╛рди рдореЗрдВ рд╢рд╛рдорд┐рд▓ рд╣реИрдВ:
- Browser Compatibility Issues: рд╕рднреА рдмреНрд░рд╛рдЙрдЬрд╝рд░реЛрдВ рдореЗрдВ рдпрд╣ рд╕рд╣реА рд╕реЗ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ред
- Complexity: рдЗрд╕реЗ рд╕рд╣реА рддрд░реАрдХреЗ рд╕реЗ рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП HTML, CSS, рдФрд░ JavaScript рдХрд╛ рдЕрдЪреНрдЫрд╛ рдЬреНрдЮрд╛рди рдЖрд╡рд╢реНрдпрдХ рд╣реИред
- Performance Issues: рдХрдИ рдЗрдлреЗрдХреНрдЯреНрд╕ рдХреЗ рдХрд╛рд░рдг рдкреЗрдЬ рдХреА рдЧрддрд┐ рдкреНрд░рднрд╛рд╡рд┐рдд рд╣реЛ рд╕рдХрддреА рд╣реИред