JavaScript Makes It React

The third language of the web is JavaScript. HTML gives a page its content and CSS its look, and JavaScript makes it do things: react to clicks, change what the page shows, check forms or load new data. Unlike HTML and CSS, JavaScript is a programming language: you write instructions that the browser carries out one after another.

The page now has a button, an empty paragraph below it and a third file, script.js, which the page loads with the line <script src="script.js"></script> at the end of index.html. Here's the whole script:

const button = document.querySelector("#hello");
const message = document.querySelector("#message");

button.addEventListener("click", function () {
    message.textContent = "Hi! Welcome to my page.";
});

In plain words:

• The first line finds the button on the page (the element with id="hello") and gives it the name button.
• The second line finds the empty paragraph with id="message" and names it message.
• The rest says: when someone clicks the button, put the text in quotes into the paragraph.

Click the button in the preview and watch the text appear. Don't worry about all the brackets and semicolons for now. On this path, you'll learn to write HTML, CSS and JavaScript yourself, one language at a time, starting from the very beginning.