Adding JavaScript
It’s time to round out our experience with HTML, CSS, and JavaScript by adding some interactivity to our page. Right-click on the project folder and add a JavaScript file called index.js
.
We’re going to add a button to our HTML file, then have that button react when we click it using JavaScript. We’ll write the JavaScript code first; then, we’ll go back and add the button.
Adding some JavaScript code
Enter this code into your index.js
file:
const btn = document.getElementById("btnClickMe"); const textDisplay = document.getElementById("textDisplay"); let clickCount = 0;
We’ll add some elements to the HTML file that are referenced in this JavaScript in a minute. First, we’ll add a button with an ID of btnClickMe
. Then, we’ll add a span tag inside a paragraph with an ID of textDisplay
. Finally, we’ll create a variable called clickCount
. You can probably see where this is going....