JavaScript

JS Basics

JS Variables & Operators

JS Data Types & Conversion

JS Numbers & Math

JS Strings

JS Dates

JS Arrays

JS Control Flow

JS Loops & Iteration

JS Functions

JS Objects

JS Classes & Modules

JS Async Programming

JS Advanced

JS HTML DOM

JS BOM (Browser Object Model)

JS Web APIs

JS AJAX

JS JSON

JS Graphics & Charts

JavaScript

JS Basics

JS Variables & Operators

JS Data Types & Conversion

JS Numbers & Math

JS Strings

JS Dates

JS Arrays

JS Control Flow

JS Loops & Iteration

JS Functions

JS Objects

JS Classes & Modules

JS Async Programming

JS Advanced

JS HTML DOM

JS BOM (Browser Object Model)

JS Web APIs

JS AJAX

JS JSON

JS Graphics & Charts

JS Output


📘 JavaScript Output – How to Display Results in JS

JavaScript provides multiple ways to output or display data to users or developers. Each method is used in different situations depending on your needs.


1️⃣ Using innerHTML

The innerHTML property sets or returns the HTML content of an element.

<p id="demo"></p>

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

🧠 Best For: Displaying content in the web page dynamically.


2️⃣ Using document.write()

The document.write() method writes content directly into the HTML document.
Warning: It overwrites the entire page if used after the page has loaded.

<script>
  document.write("This is written using document.write()");
</script>

⚠️ Avoid using it in modern apps, especially after the document is fully loaded.


3️⃣ Using window.alert()

The alert() method pops up a dialog box with the specified message.

<script>
  alert("Hello! This is an alert box.");
</script>

🧠 Best For: Quick debugging or user notifications.


4️⃣ Using console.log()

The console.log() method logs information to the browser console.

<script>
  console.log("This is a message in the console.");
</script>

🧠 Best For: Developers — used for debugging code.


Practice Questions

Q1. How do you use JavaScript to insert the text "Welcome to my website" into a <p> element with the id message using innerHTML?

Q2. How can you write the message "Page Loaded" directly into the HTML document using document.write()?

Q3. How do you create a pop-up alert box in JavaScript that says "Please enter your name"?

Q4. How can you print the number 42 in the browser’s console using console.log()?

Q5. What happens when you use document.write() after the webpage has fully loaded? Demonstrate with an example.

Q6. How can you use innerHTML to change the content of a <div> with id output to "JS Output Example"?

Q7. How do you show both a console log and an alert for the message "Debugging started"?

Q8. How do you create an HTML page where clicking a button logs "Button clicked!" to the console?

Q9. What is the correct way to display multiple lines using document.write()?

Q10. How do you insert dynamic content (like a user's name) into an HTML element using innerHTML?


JS Output Quiz

Q1: Which method is commonly used to write into an HTML element?

A. writeText()
B. innerHTML
C. textContent
D. console.write()

Q2: What will document.write("Hello") do if run after the document is loaded?

A. Shows an alert
B. Replaces the entire page content
C. Adds a footer
D. Logs to the console

Q3: Which JavaScript method is used to display a pop-up alert box?

A. console.log()
B. innerHTML
C. window.alert()
D. show()

Q4: What is the best method for displaying information to developers during debugging?

A. alert()
B. console.log()
C. innerHTML
D. prompt()

Q5: Which output method inserts content into a specific element on the page?

A. document.write()
B. alert()
C. innerHTML
D. confirm()

Q6: Which output method displays information in the browser’s developer console?

A. console.log()
B. document.show()
C. innerText()
D. print()

Q7: Which method is not recommended in modern JavaScript practice?

A. alert()
B. document.write()
C. innerHTML
D. console.log()

Q8: What is the correct syntax for writing a console log?

A. log.console("Message")
B. console.log("Message");
C. console.write("Message")
D. print.console("Message")

Q9: Which of the following outputs a string on the webpage itself?

A. alert("Text")
B. console.log("Text")
C. document.write("Text")
D. prompt("Text")

Q10: What type of message is suitable to show using alert()?

A. Errors in backend code
B. Hidden debugging info
C. Important user notices
D. CSS styles

Go Back Top