Imagine having four different ways to share news with someone, writing it on their whiteboard, popping up in front of their face to tell them directly, whispering it only to people who are specifically listening, or shouting it into an intercom that only technicians hear.
JavaScript has a similar set of choices for showing output, innerHTML changes what's written on the page itself, alert interrupts the user directly, document.write writes into the page during loading, and console.log speaks only to developers watching the console.
Knowing which one fits a given situation is one of the first practical skills for working with JavaScript on any site, including cookiescursor.com.
innerHTML आपको किसी element के भीतर की HTML सामग्री पढ़ने या बदलने देता है, जो इसे webpage पर सीधे गतिशील output दिखाने का सबसे आम तरीका बनाता है।
Note:
innerHTML केवल सादा text नहीं, पूरे HTML tags भी डाल सकता है, जो इसे markup के छोटे टुकड़े गतिशील रूप से बनाने के लिए शक्तिशाली बनाता है।
Warning:
Inserting untrusted user input directly with innerHTML can expose a site to cross-site scripting attacks, always sanitize such input first.
उदाहरण: Using innerHTML
javascript
document.body.innerHTML = "<h2>Hello!</h2><p>This text was added with innerHTML.</p>";
window.alert() का उपयोग
alert() संदेश के साथ एक छोटा popup dialog खोलता है जो पूरे page को तब तक रोक देता है जब तक visitor OK न दबाए, जो अत्यावश्यक सूचनाओं के लिए उपयोगी है पर रोज़मर्रा के output के लिए बाधाकारी।
Note:
alert() को development के दौरान त्वरित debugging के लिए रखिए, असली applications अपने अंतिम user experience के लिए शायद ही इसे इस्तेमाल करते हैं।
Warning:
alert() blocks all other JavaScript execution on the page until it is dismissed, which can freeze animations or timers unexpectedly.
उदाहरण: Using window.alert()
javascript
window.alert("This is an urgent message!");
document.write() का उपयोग
document.write() text को सीधे HTML document में लिखता है जब वह load हो रहा हो, एक तकनीक जो अधिकांश आधुनिक तरीकों से पुरानी है और अब साधारण उदाहरणों से आगे किसी भी काम के लिए पुरानी मानी जाती है।
Note:
document.write() ज़्यादातर पुराने tutorials में दिखता है, आधुनिक JavaScript लगभग हमेशा innerHTML या DOM methods को तरजीह देती है।
Warning:
Calling document.write() after the page has finished loading erases the entire existing page content, a surprising and destructive side effect.
उदाहरण: Using document.write()
javascript
document.write("This text is written directly into the page.");
console.log() का उपयोग
console.log() संदेशों को browser के developer console में print करता है, जो केवल developers को दिखने वाला औज़ार है, और visitors जो देखते हैं उसे प्रभावित किए बिना values जाँचने और code को debug करने का मानक तरीका है।
Note:
उदाहरणों पर काम करते समय console.log का output देखने के लिए अपने browser के developer tools खोलिए और Console tab देखिए।
Warning:
console.log statements left in production code are usually harmless but should be cleaned up, since they can clutter the console and occasionally leak internal details.
उदाहरण: Using console.log()
javascript
console.log("Check the browser console to see this message.");
सही Output Method चुनना
सही output method चुनना श्रोता पर निर्भर करता है: जो सामग्री visitors को दिखनी चाहिए उसके लिए innerHTML, alert केवल किसी ऐसी अत्यावश्यक चीज़ के लिए जो उन्हें रोकनी ज़रूरी हो, console.log केवल developer debugging के लिए, और साधारण सीखने के उदाहरणों के बाहर document.write से बचिए।
Note:
अंगूठे के नियम के तौर पर, पूछिए कि संदेश असल में किसके लिए है, visitor को innerHTML दिखता है, developer को console.log।
Warning:
Mixing up these methods in a live application, like using alert() for routine confirmations, creates a jarring experience for visitors.
उदाहरण: Choosing the Right Output Method
javascript
console.log("Visible only to developers"); // for debugging
document.body.innerHTML = "<p>Visible to visitors</p>"; // for users
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the
view already swaps in the hi_ translation fields (or blanks these
out if untranslated), so this renders correctly for both languages
without a lang_code check here. #}