HTML is the skeleton, CSS is the look. So who’s in charge of the movement—things like “press a button and a number goes up” or “a menu opens”? That’s JavaScript.
The three roles, side by side
| Language | In charge of |
|---|---|
| HTML | Content and structure |
| CSS | The look |
| JavaScript | Movement and behavior |
These three combine to make the web pages you’re looking at right now. To put it in human terms: HTML is the bones, CSS is the clothes, and JavaScript is “the power to talk and move.” Only when all three are together does a page come alive.
Most of the “movement” around you is this one language
In fact, a lot of the movement you touch every day is JavaScript’s doing.
- The heart count goes up when you press “like”
- Suggestions appear as you type in a search box
- A menu pops open when you press a button
When you press, type, or move something and something happens—that’s usually JavaScript working behind the scenes. Once you see it’s not special magic but an everyday mechanism, it starts to feel much less intimidating.
The very first step
Your first hello to JavaScript usually looks like this.
alert("Hello!");Just that, and a little notice (a popup) saying “Hello!” appears on the screen. What you wrote moves, right before your eyes—that’s the greatest joy of programming. For now, “huh, so writing it this way makes it work” is plenty.
Breaking down this one line, here’s what it looks like.
| Part | Meaning |
|---|---|
alert | The command “show a notice” |
Inside ( ) | What you want to show |
"Hello!" | The text to show (wrapped in " ") |
; | The mark for the end of a statement (like a period) |
“Command name + the ingredients inside the parentheses”—JavaScript statements mostly take this shape. However many commands come up from here on, the skeleton is the same.
Where do you write JavaScript?
Just as you’ve written HTML in index.html and CSS in style.css, JavaScript is basically written in its own dedicated file like script.js. Since it’s just text inside, the tool for writing it is your usual editor.
And what runs it is your usual browser. A browser doesn’t only read HTML and CSS to build the screen—it also has the power to read JavaScript from top to bottom and run it. No special machine or software needed.
Tell the HTML to read it
That said, just creating script.js and leaving it there isn’t enough—the browser won’t notice it. Exactly like connecting CSS with <link>, you need to tell it from the HTML side: “read this file too.” That’s the <script> tag.
<body>
<h1>Shima's page</h1>
<script src="script.js"></script>
</body>src="script.js" is “where the file to load lives.” If it sits in the same folder as index.html, the filename alone connects them.
Summary of this lesson
- JavaScript is the language in charge of movement
- The web is made by a three-person team: HTML, CSS, and JavaScript
- Much of the “press it and it moves” around you is JavaScript’s doing
- Write it in
script.js, and connect it to the HTML with<script src="script.js"></script>