JavaScript Likhne ke 3 Tarike

Samjhein Inline, Internal, aur External JavaScript ka use kab aur kaise karein.

Introduction

JavaScript ko HTML document me add karne ke kai tarike hain. Har tarike ka apna use-case aur fayda hai. Primarily, teen methods follow kiye jaate hain: Inline, Internal (ya Embedded), aur External. Chaliye in teeno ko detail me samajhte hain.

1. Inline JavaScript

Inline JavaScript me, code ko direct HTML element ke andar, event attributes (jaise onclick, onmouseover) ka use karke likha jaata hai. Yeh method chhote, single-use scripts ke liye aamtaur par use hota hai.

<button onclick="alert('Button Clicked!')">Click Me</button>

Fayde aur Nuksaan:

Fayda: Quick aur simple tasks ke liye aasan hai.
Nuksaan: Code readability kam hoti hai aur maintain karna mushkil hota hai. Yeh best practice nahi maana jaata.

2. Internal (or Embedded) JavaScript

Internal JavaScript me, code ko <script> tag ke andar, HTML file ke <head> ya <body> section me likha jaata hai. Yeh method single-page scripts ya specific page functionality ke liye accha hai.

<!DOCTYPE html>
<html>
<head>
  <title>Internal JS</title>
</head>
<body>
  <script>
    console.log("Internal JavaScript is running!");
  </script>
</body>
</html>

Fayde aur Nuksaan:

Fayda: Page-specific scripts ke liye organized rehta hai.
Nuksaan: Code reusability nahi hoti; agar same script multiple pages par use karna ho toh copy-paste karna padta hai.

3. External JavaScript

Yeh sabse common aur recommended method hai. Isme JavaScript code ko ek alag file (extension .js) me save kiya jaata hai aur use <script> tag ke src attribute ka use karke HTML file me link kiya jaata hai.

<!-- HTML File me -->
<script src="myscript.js"></script>

// myscript.js File me
console.log("External JavaScript is running!");

Fayde aur Nuksaan:

Fayda: Code clean, reusable, aur maintainable rehta hai. Isse page load speed bhi improve hoti hai kyunki browser .js file ko cache kar sakta hai.
Nuksaan: Chhote scripts ke liye ek extra file banana overkill ho sakta hai.

Comparison Table

Feature	Inline	Internal	External
Code Placement	HTML attribute me	`<script>` tag me	Alag `.js` file me
Reusability	Bahut kam	Kam	Sabse zyada
Maintenance	Mushkil	Moderate	Aasan
Best For	Single-use, chhota code	Page-specific script	Complex & reusable logic

Test Your Knowledge!

Kya aap JavaScript Likhne ke baare mein seekh chuke hain? Chaliye dekhte hain!

Apni knowledge test karne ke liye is quick quiz ko dein.

Start Quiz

Bonus: Practical Application!

Ab in methods ko practically use karke dekhein.

JavaScript code editor me external file ka concept simulate karein aur dekhein ki logic kaise kaam karta hai.

Practice in JS Editor