Course Progress 18%

JavaScript Output

JavaScript में Output का मतलब है किसी जानकारी, result या message को user तक दिखाना। जब हम JavaScript सीखते हैं, तो सबसे पहले यह समझना जरूरी होता है कि हमारा लिखा हुआ code क्या result produce कर रहा है और वह result कहां दिखाई देगा। JavaScript में output दिखाने के कई तरीके होते हैं, और हर तरीका अलग-अलग situation में use किया जाता है।

इस chapter में हम JavaScript के सबसे common और beginner-friendly output methods को detail में समझेंगे।

JavaScript में Output दिखाने के मुख्य तरीके

JavaScript में output दिखाने के लिए आम तौर पर ये methods use किए जाते हैं:

  • document.getElementById().innerHTML
  • document.write()
  • window.alert()
  • console.log()

अब हम इन सभी को एक-एक करके simple language और practical examples के साथ समझते हैं।

innerHTML का उपयोग करके Output दिखाना

innerHTML का उपयोग HTML page के अंदर किसी specific element के content को change या display करने के लिए किया जाता है। यह method सबसे ज्यादा use होती है क्योंकि इससे output directly web page पर user को दिखाई देता है।

Example: innerHTML का basic उपयोग

<!DOCTYPE html>
<html>
<body>

<h2 id="demo"></h2>

<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>

</body>
</html>

यह code HTML page पर Hello JavaScript! text को display करता है।

इस code में document.getElementById("demo") HTML के उस element को select करता है जिसका id “demo” है। इसके बाद innerHTML उस element के अंदर का content set करता है।

यह method इसलिए use की जाती है क्योंकि हम JavaScript के through dynamic content दिखा सकते हैं, जैसे calculation का result, user input या server से आया data।

जब यह code run होगा, तो page load होते ही <h2> tag के अंदर Hello JavaScript! दिखाई देगा।

Example: Calculation का output innerHTML से दिखाना

<p id="result"></p>

<script>
document.getElementById("result").innerHTML = 5 + 10;
</script>

यह code 5 और 10 को add करके result दिखाता है।

यहां JavaScript expression 5 + 10 calculate होकर 15 बनता है। innerHTML इस result को paragraph के अंदर show करता है।

इसका output होगा 15, जो browser page पर text के रूप में दिखाई देगा।

document.write() का उपयोग करके Output दिखाना

document.write() method सीधे HTML document में text या content लिखने के लिए use होती है। यह method beginners के लिए simple है, लेकिन real projects में कम use की जाती है।

Example: document.write() का basic उपयोग

<script>
document.write("Welcome to JavaScript Tutorial");
</script>

यह code browser page पर Welcome to JavaScript Tutorial text दिखाता है।

यह method page load के समय document में content लिखती है। इसका use mainly learning purpose के लिए किया जाता है ताकि beginners को output जल्दी समझ में आ सके।

इस code का result सीधे web page पर दिखाई देगा।

Important Behavior of document.write()

अगर document.write() को page load होने के बाद run किया जाए, तो यह पूरा HTML document overwrite कर देता है। इसलिए modern web development में इसका use avoid किया जाता है।

window.alert() का उपयोग करके Output दिखाना

window.alert() method browser में popup message दिखाने के लिए use होती है। यह method user का attention grab करने के लिए useful होती है।

Example: alert box दिखाना

<script>
window.alert("This is an alert message");
</script>

यह code browser में एक popup alert box दिखाता है जिसमें This is an alert message लिखा होगा।

यह method इसलिए use की जाती है क्योंकि कभी-कभी हमें user को important message या warning दिखानी होती है, जैसे form submit करने से पहले confirmation।

इस code का output web page के अंदर नहीं, बल्कि एक popup box के रूप में दिखाई देगा।

Short Syntax for alert

<script>
alert("Hello User");
</script>

यह code भी वही काम करता है। window keyword optional होता है।

console.log() का उपयोग करके Output दिखाना

console.log() method browser console में output दिखाने के लिए use होती है। यह method developers के लिए debugging और testing में बहुत useful होती है।

Example: console.log() का basic उपयोग

<script>
console.log("JavaScript is running");
</script>

यह code browser के console में JavaScript is running message show करता है।

यह method इसलिए use होती है क्योंकि user को message दिखाने की जरूरत नहीं होती, बल्कि developer code के behavior को check करना चाहता है।

इस code का output browser page पर दिखाई नहीं देगा। इसे देखने के लिए browser का Developer Tools खोलकर Console tab check करना होगा।

Example: Calculation का output console में दिखाना

<script>
console.log(20 + 30);
</script>

यह code 20 और 30 को add करता है और result console में print करता है।

इसका output 50 होगा, जो console में दिखाई देगा।

JavaScript Output Methods का सही उपयोग

हर output method का अपना purpose होता है:

  • innerHTML user को page पर data दिखाने के लिए
  • document.write() learning और simple examples के लिए
  • window.alert() popup messages और warnings के लिए
  • console.log() debugging और development के लिए

जब आप JavaScript सीखते हैं, तो इन सभी methods का practice करना जरूरी होता है ताकि आपको यह समझ आ सके कि कौन सा output कहां और क्यों use किया जाता है।