JavaScript

coding learning websites codepractice

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?


JavaScript

online coding class codepractice

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

Go Back Top