When do scripts run? Inline, end of body, defer
The deferred script appears first in the HTML but runs after parsing finishes, just before DOMContentLoaded. A data: URL stands in for a real file so the example works offline.
The HTML questions interviewers ask most (semantic HTML, the doctype, data attributes, async and defer, accessibility and SEO) with model answers that show the mechanism, the trade-off and a real example.
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 6 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Write a product list item that stores a product id and price for JavaScript, then write the JavaScript that reads the price as a number and adds 18% tax.
Write the <head> script tags for: an analytics script that doesn't depend on anything, a library, and your app code that uses the library. Explain your choice.
Write a 4-part answer (define, mechanism, why, example) to: "Why does every page need a lang attribute?"
Explain it without notes
Explain the difference between <script>, <script defer>, <script async> and <script type="module">.
What is the difference between an element's attributes and its dataset? When would you use data-*?
Why should you use <button> instead of <div onclick>? Give at least four reasons.
What is the accessibility tree, and how do HTML choices affect it?
A page ranks poorly and screen reader users complain. Which HTML would you check first?
Preview
Console
Nothing logged yet.Expected console output
1. inline script in the body (during parsing)
2. script at the end of the body
3. deferred script (after parsing)
4. DOMContentLoaded
5. load (images and everything else done)