JAVASCRIPT DISPLAY OUTPUT
In the coming chapters we will use javascript property to display output / results on the screen. We will learn in this chapter how to display some content on the screen using javascript.
Different Ways To Display Output using Javascript
Javascript can display output using following methods:
- Injecting text into elements, using innerHTML property.
- Injecting text into HTML document, using document.write() method.
- Displaying using alert box, window.alert() or alert() method.
- Displaying in the browser's console, using console.log() method.
How to access an Element in javascript
Javascript has many methods to access any element from the HTML document. Some of these are
- Accessing elements using id, using getElementById("id") method.
- Accessing elements using class name, using getElementsByClassName("class") method.
- Accessing elements using tag name, using getElementSByTagName("tag") method.
In the coming chapter we will mainly use the getElementById method. To access the element we pass id of that element in this method.
1. Output Using innerHTML
innerHTML
is a property for HTML elements. To write something inside an element we first get
that element (here using getElementById
method) and then apply innerHTML
property to
that. For example getElementById("id").innerHTML = "Hello, World!"
.
2. Output Using document.write()
document.write()
is a method using which you can write something on a webpage.
document.write()
method overwrites all of the things inside an HTML document, So be careful
while using it. Never use this method after the document is loaded otherwise it will overwrite all.
3. Output Using document.alert()
document.alert
or alert
method is used to show some output or result. It creates a
pop up showing the result.
4. Output Using console.log
console.log
is used to show results in the console. console is
used by developers for debugging purposes.
To open console press ctrl+shift+i or f12 then switch to console tab.
To show results in console write
console.log(your_output_here). Using it you can output number, string, boolean, function, objects and many more.
Output :
