04.JavaScript基础
1. JavaScript是什么?为什么需要它?
1.1 从"静态"到"动态":HTML、CSS与JavaScript的关系
还记得我们之前学的HTML和CSS吗?
- HTML = 网页的"骨架"(结构)
- CSS = 网页的"皮肤"(样式)
- JavaScript = 网页的"大脑"(行为)
实际例子:
只有HTML+CSS的网页(静态,不能交互):
1
2<button>点击我</button>
<!-- 点击按钮,什么都不会发生 -->
加上JavaScript后的网页(动态,可以交互):
1
2
3
4
5
6<button id="myButton">点击我</button>
<script>
document.getElementById('myButton').addEventListener('click', function() {
alert('按钮被点击了!');
});
</script>
💡 关键理解:
HTML负责"内容是什么",CSS负责"内容长什么样",JavaScript负责"内容能做什么"。