Hello, world!

This part of the course is about the JavaScript language itself — the syntax and ideas that are the same wherever your code runs.

But to run anything, you need somewhere to run it. Since you’re reading in a browser, that’s the most convenient place to start, so our examples run there. We’ll lean on browser-only commands like alert as little as possible, so that if your real target is another environment — Node.js, say — you’re not learning throwaway details. The browser-specific side of things gets its own dedicated part later.

On the server, running a script is a one-liner: save it as my.js and type node my.js. In the browser you first have to attach the script to a page.

The “script” tag

You can drop JavaScript almost anywhere in an HTML document by wrapping it in a <script> tag. When the browser parses the page and reaches that tag, it runs the code inside immediately.

<!DOCTYPE HTML>
<html>

<body>

  <p>Before the script...</p>

  <script>
    alert( 'Hello, world!' );
  </script>

  <p>...After the script.</p>

</body>

</html>

Load that page and a dialog pops up saying Hello, world! — the browser hit the <script> block, executed alert(...), and only then carried on to render the paragraph below it. That “run it the moment I see it” behaviour matters more than it looks; we’ll come back to it when we discuss page loading.

page.html
<script>
alert(‘hi’);
</script>
inline — code lives in the page
page.html
<script src=“app.js”></script>
↓ browser fetches
app.js
alert(‘hi’);
A script reaches the page two ways: written inline between <script>…</script>, or pulled from a separate .js file via src.

Modern markup

The <script> tag has a handful of attributes you’ll only ever meet in old code. Knowing them mostly helps you recognise something as ancient.

The type attribute: <script type=…>

The old HTML4 standard insisted every script declare a type, almost always type="text/javascript". Modern HTML dropped that requirement and quietly repurposed the attribute: today type is how you opt a script into being a module (type="module") — a more advanced topic we cover in its own chapter. For plain scripts, leave it off.

The language attribute: <script language=…>

This once declared which scripting language you were using. Since JavaScript is the only one browsers run, it’s pure noise now. Never write it.

Comment wrappers around scripts

In genuinely old material you may see script contents wrapped in an HTML comment:

<script type="text/javascript"><!--
    ...
//--></script>

This was a trick to hide the code from prehistoric browsers that couldn’t understand <script> at all — they’d treat the whole thing as a comment instead of printing it as text. No browser from the last decade-and-a-half has that problem, so if you spot this pattern, you’re looking at very old code.

External scripts

Once you have more than a few lines, you’ll want the code in its own file rather than crammed into the HTML. You attach a file with the src attribute:

<script src="/path/to/script.js"></script>

The path /path/to/script.js is absolute — measured from the site root. You can also give a relative path from the current page: src="script.js" and src="./script.js" both mean “a file named script.js sitting next to this page.” And a full URL works too, which is how you’d pull in a library from a CDN:

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

Need several files? Use several tags — they run top to bottom:

<script src="/js/script1.js"></script>
<script src="/js/script2.js"></script>

Summary

  • A <script> tag drops JavaScript into a page, and it runs the instant the browser reaches it.
  • The type and language attributes are legacy — you don’t need them (except type="module", much later).
  • To load code from a file: <script src="path/to/script.js"></script>, and prefer this for anything non-trivial so the browser can cache it.

There’s a great deal more to how scripts and pages interact — loading order, deferring, modules — but that’s browser territory, and this part of the course is about the language. We’re using the browser purely as a convenient place to press “run.” It’s one host among many.