JavaScript Output
JavaScript Output:
How to display JavaScript
JavaScript can display information in different ways:
window.alert () via the alert box using
document.write () Write to HTML document using
.innerHTML Write to HTML element using
console.log () can be shown in the browser console using
Use window.alert ()
You can use the alert box to display information
Example:
- <html lang="en">
- <head>
- <meta charset="utf-8">
- <title>This is JavaScript Example !</title>
- </head>
- <body>
- <h1>My first web page..</h1>
- <script>
- window.alert ("Welcome");
- </script>
- </body>
- </html>
Output:
Use document.write ():
It is convenient to use document.write () for testing purposes
Example:
- <html lang="en">
- <head>
- <meta charset="utf-8">
- <title>This is JavaScript Example !</title>
- </head>
- <body>
- <h1>My first web page..</h1>
- <script>
- document.write ("Welcome");
- </script>
- </body>
- </html>
Output:
My first web page..
Welcome
Using document.write () after the HTML element is fully loaded deletes all previous HTML:
Example:
- <html lang="en">
- <head>
- <meta charset="utf-8">
- <title>This is JavaScript Example !</title>
- </head>
- <body>
- <h1>My first web page..</h1>
- <button onclick="document.write('Welcome')">Click Me</button>
- </body>
- </html>
Output:
The document.write () method should only be used for testing.
Use innerHTML:
The JavaScript document.getElementById (id) method is used to access HTML elements.
The id attribute refers to the HTML element and the innerHTML property refers to the HTML content:
Example:
- <html lang="en">
- <head>
- <meta charset="utf-8">
- <title>This is JavaScript Example !</title>
- </head>
- <body>
- <p id = "test" onclick = "myFunction ()">Please Click me to change my HTML content (innerHTML). </p>
- <script>
- function myFunction (){
- document.getElementById ("test"). innerHTML = "Please Paragraph changed";
- }
- </script>
- </body>
- </html>
Output:
Please Click me to change my HTML content (innerHTML).
A common method is to display data in HTML by modifying the innerHTML property of the HTML element.
Use console.log ():
You can use the console.log () method to display data on your browser console.
F12 activates the browser console and selects "Console" from the menu.
Example:
- <html lang="en">
- <head>
- <meta charset="utf-8">
- <title>This is JavaScript Example !</title>
- </head>
- <body>
- <h1>My first web page..</h1>
- <script>
- console.log("Wlocome!");
- </script>
- </body>
- </html>
Output:
My first web page..
Thank You...
shelleyakter
wow nice post
shelleyakter
Thank you