Web Browser Console and JavaScript

The web browser console is very useful for JavaScript. To access the browser console in Chrome, open the menu, click tools, and then developer tools. There should be a tab for console in the top menu bar.

Check the documentation for other browsers on how to access the console in those browsers.

Shown below is some simple HTML code that can be used to interact with the browser console:


<body>
++<h1 id ="title" onclick="console.log('hello');">
++++Hello
++</h1>
</body>

 

The console will log ‘hello’ each time the <h1> element is clicked.

Think of JavaScript as having the ability to work with different ‘objects’. The console is one object. HTML tags can be other objects, and the HTML document itself is an object. Interacting with these various objects represents the vast majority of what web developers do with JavaScript.

In the above example, look at the code "console.log('hello');". The log function is being called on the console. While this code is rather simple, it’s extremely important on a conceptual level. It underscores the relationship of how to call functions on objects. The ‘.’ between ‘console’ and ‘log’ is what links the object to the function. Developers often debug or test JavaScript code by printing to the browser console.

Leave a Reply

Your email address will not be published. Required fields are marked *