Lynxsia IT Solution

JavaScript Output

JS Output

JavaScript can display data or output in many different ways:

Display data inside an element using innerHTML
Display inside whole HTML document using document.write()
Display into alert box using alert()
Display into browser console using console.log()

JavaScript Working

JavaScript may start executing its code at the moment we visit the website and the web page begins to load.

So when JS code finishes execution, we have processed data, and most of the time this updated data need to be changed on the web page.

Using innerHTML

The innerHTML property defines the HTML content of the element. We can select element by id attribute, class attribute, etc.

The innerHTML property is normally used when we want to change content of the element.

					 
        
          <!DOCTYPE html>
          <html>
            <body>
              <h1>innerHTML Demo</h1>
              <p id="demo"></p>

              <script>
                document.getElementById("demo").innerHTML = 5 + 6;
              </script>
            </body>
          </html>

Test Code Online

If we write <script> element inside <head> element then this will not change any thing because JS code executed before <p id="demo"> rendered on the page.

Using document.write()

The document.write() method writes data inside HTML by deleted existing content.

					 
        
          <!DOCTYPE html>
          <html>
            <body>
              <h1>document.write() Demo</h1>
              <button onClick="document.write(5 + 6)">Click Me</button>
            </body>
          </html>

Test Code Online

As document.write(); method deletes everything, it should be used for testing and debugging.

Using alert()

The alert() method show an alert box and can be used to show data.

					 
        
          <!DOCTYPE html>
          <html>
            <body>
              <h1>alert() Demo</h1>

              <script>
                alert(5 + 6);
              </script>
            </body>
          </html>

Test Code Online

The alert(); method mostly used to notify users.

Using console.log()

The console.log() method display data in browser console.

					 
        
          <!DOCTYPE html>
          <html>
            <body>
              <h1>console.log() Demo</h1>

              <script>
                console.log(5 + 6);
              </script>
            </body>
          </html>

Test Code Online

The console.log(); method can be used for testing and debugging.

View JS PDF Ebooks

Previous Next

How you feel about this blog:

Share this blog on:

Report Us

If you find any error in the turtorials, or want to share your suggestion/feedback, feel free to send us email at: info@lynxsia.com

Ads

JavaScript Output

JS Output

JavaScript Working

Using innerHTML

Using document.write()

Using alert()

Using console.log()

Report Us

Solutions

Prices

Industries

Resources

Lynxsia IT Solutions