Drag the edges to resize the window.

In Projects, you can keep track of your progress as you go throught the tasks. Check each item as you complete it!

Web Browser

Code Editor
JavaScript and the DOM

Linking JavaScript

We can link a JavaScript file to HTML by including it as the src of a <script> tag inside of an HTML file, like this:

<script src='js/main.js'></script>

This line of code will link the file located at js/main.js. You can find this file in the file navigator by clicking the file button located at the top left of the code editor. Within the navigator, there's a folder named js, and within that folder is the main.js file.

By linking js/main.js in the index.html file, we are asking the browser to run our JavaScript code each time index.html loads.

We've provided you with a sample website (and the corresponding HTML and CSS code). Our goal: use JavaScript to make this page more dynamic. We will add interactive features to it as we go through the lesson.

In the code editor, we've loaded the files for a static HTML and CSS website. If you've never seen HTML before, don't worry, we'll walk through how JavaScript is added to an existing HTML and CSS project in this lesson. This lesson won't require you to greatly modify the HTML and CSS code itself. (For a deeper dive, see our HTML & CSS course here.)

Report a Bug
If you see a bug or any other issue with this page, please report it here.