Loading...

HTML JavaScript

HTML structures content. CSS styles it. JavaScript adds behavior — responding to clicks, updating text, talking to servers. This lesson only shows how HTML loads scripts.

Direct answer

Use <script> for inline code or <script src="app.js"></script> for an external file. Many pages place scripts at the end of body so content appears first. Modern apps also use type="module" — learn that when you study JS deeply.

Inline script example

html
HTML Code
<button id="hi" type="button">Say hi</button>
<script>
document.getElementById("hi").addEventListener("click", function () {
document.getElementById("hi").textContent = "Hello!";
});
</script>

External script

html
HTML Code
<script src="app.js"></script>

Keep content usable even if scripts fail. Do not put critical information only inside JavaScript.

Try it

  1. Add a button with an id
  2. Write a tiny script that changes its text on click
  3. Move the same logic into app.js and load it with src
  4. Confirm the HTML still makes sense without the script

Easy mistakes

  • Relying on JS for content that should be plain HTML
  • Broken src paths so scripts never load
  • Huge inline scripts that are hard to maintain

Summary

  • script loads JavaScript
  • Prefer external .js files as projects grow
  • HTML remains the content foundation
  • Deeper JS is a separate learning path

🧠 Test Your Knowledge

Ready to Start

Test Your Knowledge

Challenge yourself with this interactive quiz and see how well you understand the topic

❓
4
Questions
🎯
70%
To Pass
♾️
∞
Time
🔄
∞
Attempts

📝 Instructions

  • Read each question carefully
  • Select the best answer for each question
  • You can retake the quiz as many times as you want
  • Your progress will be shown at the top