Module scripts are deferred automatically
The module was written first but ran last, after parsing, so it could see the paragraph.
JavaScript reaches a page through the <script> element, either written inline or loaded from a .js file; where you put it and whether you add defer, async or type="module" decides when it runs and what it can see.
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 5 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Write the head of a page that loads menu.js and then app.js so both run after parsing, with app.js guaranteed to run second.
Rewrite the first live example so the head script works without moving it, using DOMContentLoaded.
Explain it without notes
What is the difference between a plain script, defer and async?
Why does document.getElementById return null when called from a plain script in the head?
Why are external script files preferred over inline scripts on real sites?
Preview
Console
Nothing logged yet.Expected console output
Classic script runs first, during parsing
Module sees the paragraph below it: true