" Start your business on internet, we are here to help you "

We are Software Development and Technical Service providing company from kathmandu Nepal. We use latest technologies to fulfill your requirements

Display data using JavaScript

JavaScript     Published at about 2 months ago    Bishnu Basyal

Display data using JavaScript

Display data using JavaScript

We can display data using JavaScript in following ways:

READ: What is onclick Event?

1) Using innerHTML

This method is used to writing into an HTML element.

Use document.getElementById(id) method to access an HTML element.

The id attribute defines the HTML element and innerHTML property defines the HTML content.

<!DOCTYPE html>
<html>
<body>
<p id="hello"></p>
  <script>
    document.getElementById("hello").innerHTML = "Hello JavaScript";
  </script>
</body>
</html>

innerHTML is a common way to display data in HTML.

 

2) Using document.write()

This method is used for writing into HTML output.

document.write() is very usefull for testing purposes.

<!DOCTYPE html>
<html>
<body>
  <script>
    document.write("Hello JavaScript");
  </script>
</body>
</html>

Using document.write() after an HTML document is fully loaded will delete all existing HTML.

<!DOCTYPE html>
<html>
<body>
<h2>I am heading</h2>
<p>I am paragraph.</p>
<button type="button" onclick="document.write("Hello JavaScript")">Try it</button>
</body>
</html>

The document.write() method should only be used for testing purposes.

 

READ: How to Create Sticky Navigation with jQuery ?

 

3) Using window.alert()

This method is used for writing into an alert box.

You can use an alert box to display data.

This type of output is usefull while displaying notice, confirmation etc.

<!DOCTYPE html>
<html>
<body>
  <script>
    window.alert("Hello JavaScript");
  </script>
</body>
</html>

 

4) Using console.log()

This method is used for writing into browser console.

console.log() method is used for debugging purposes.

<!DOCTYPE html>
<html>
<body>
  <script>
    console.log("Hello JavaScript");
  </script>
</body>
</html>

Press F12 to display output.

 

READ: Top 5 Highest Paying Jobs for Computer Science

 

Thank you.....

 

 

To Top