JavaScript Output
JavaScript Tutorial » JavaScript Output
Generating Output in JavaScript
In JavaScript we have several different ways of generating output:
1. Inserting Output Inside an HTML Element, using innerHTML.2. Writing Output to the Browser Window using document.write().
3. Displaying Output in Alert Dialog Boxes, using window.alert().
4. Writing Output to Browser Console, using console.log().
Inserting Output Inside an HTML Element- example
To access an HTML element, JS can use document.getElementById(id) method.
The id attribute defines the HTML element. The innerHTML property defines the HTML content:
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Writing into an HTML Element using JavaScript</title>
</head>
<body>
<p id="greet"></p>
<p id="result1"></p>
<p id="result"></p>
<script>
// Writing text string inside an element
document.getElementById("greet").innerHTML = "Writing into an HTML Element using JavaScript";
// Writing result1
document.getElementById("result1").innerHTML = 5+6;
// Writing a variable value inside an element
var x = 10;
var y = 20;
var sum = x + y;
document.getElementById("result").innerHTML = sum;
</script>
</body>
</html>
Note: innerHTML is a common way to display data in HTML.
Using document.write() - example
To write a content to the current document you can use the document.write() method - example:
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Writing into an Browser using document.write() in JavaScript</title>
</head>
<body>
<script>
// simple message
document.write("JavaScript online tutorial!"); // Prints: Hello World!
// Printing a variable value
var a = 9;
var b = 15;
var sum = a + b;
document.write(sum); // Output: 24
</script>
</body>
</html>
Note: sing document.write() after an HTML document is loaded, will delete all existing HTML.
Displaying Output in Alert Dialog Boxes, using window.alert()., example
You can use an alert box to display data.
Example:
<!DOCTYPE html>
<html>
<body>
<h1>My First window alert</h1>
<script>
window.alert(22 + 44);
</script>
</body>
</html>
Writing Output to Browser Console - example
Easily you can outputs a message or writes data to browser console using console.log()
Example:
<!DOCTYPE html>
<html>
<body><h2>Activate Debugging</h2>
<p>Press F12 on your keybord and you will activate debugging.</p>
<p>Select "Console" in the debugger menu.</p>
<p>Then click Run again.</p><script>
console.log(22 + 44);
</script></body>
</html>
JavaScript Output to console, message, pdf, to terminal, without newline, parameter, text, html table, question, json
JavaScript Output - javascript tutorial
Online Editor
This tool makes it easy to create, adjust, and experiment with custom colors for the web.
HTML Templates
Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.
CSS HTML Layout
Find here examples of creative and unique website layouts.
Free CSS HTML Menu
Find here examples of creative and unique website CSS HTML menu.