Interactive JavaScript – The Basics

To look at a basic web page, the computer’s browser sends a URL request to a server that hosts the page to be viewed. The server finds the HTML page, and sends it back to the browser, along with CSS styling. This interaction describes web pages up through the mid to late 1990s. However, a modern web page is more interactive. Interactive JavaScript programming is a skill modern web developers must know.

How JavaScript Works with HTML5 and CSS3

A modern web page can interact with the end-user without having to load new pages. It can play a video, show drop down menus, take field input, etc. JavaScript is the language that enables this type of interactivity.

To break it down, HTML provides the structure, CSS provides the styling, and JavaScript enables interactivity. JavaScript is a high functioning language, so it will probably not be as easy to learn as HTML or CSS.

It’s important to note that JavaScript is not the same as Java. These are two completely different programming languages.

Write Your First Interactive JavaScript

<h1 id="title" onclick="alert('hello');">Hello</h1>

the above <h1> tag in HTML contains an onclick event. The onclick event attribute is when the end-user clicks on the <h1> heading. The "alert('hello');" is JavaScript that tells the browser what to do when the onclick event occurs, i.e., when the end-user clicks on the heading. Everything else is HTML, except for this little script.

In the example above, a box will pop up that says "Hello" when a user clicks on the heading. The alert is a function that tells JavaScript what to do. The ('hello') part of the script is referred to as the argument. It tells the function how to do what it has to do.

Leave a Reply

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