你有没有想过，网页上那些点击弹窗、轮播图、实时计数器是怎么实现的？其实很多都是用 ref="/tag/137/" style="color:#B2A89E;font-weight:bold;">JavaScript 写的。别被名字吓到，它和 Java 没啥关系，而是浏览器自带的“小助手”，让你的网页动起来。
先来个最简单的：弹出一句话
打开浏览器按 F12，找到控制台（Console），把下面这行代码贴进去回车：
alert('你好，世界！');“咚”一下，弹窗就出来了。这就是你的第一段 JavaScript 代码。
让网页自己说话
新建一个 .html 文件，比如叫 index.html，用记事本打开，写点基础结构：
<!DOCTYPE html>
<html>
<head>
<title>我的第一个JS页面</title>
</head>
<body>
<h1 id="greeting">等待中...</h1>
<script>
document.getElementById('greeting').innerText = '嘿，我加载好了！';
</script>
</body>
</html>双击这个文件在浏览器打开，你会发现原本“等待中...”的文字被替换了。这说明 JS 已经开始操控网页内容了。
做个会变的数字：计数器雏形
有时候你想做个倒计时，或者记录点击次数。变量和函数就能派上用场：
<button id="btn">你点了 0 次</button>
<script>
let count = 0;
const button = document.getElementById('btn');
button.addEventListener('click', function() {
count++;
button.innerText = '你点了 ' + count + ' 次';
});
</script>每点一次按钮，数字就加一。这种“记录状态+响应操作”的模式，是前端开发最常见的套路。
判断一下：做个简单问候
JS 也能做决定。比如根据时间显示不同的问候语：
<div id="welcome"></div>
<script>
const now = new Date();
const hour = now.getHours();
let msg = '';
if (hour < 12) {
msg = '早上好！';
} else if (hour < 18) {
msg = '下午好！';
} else {
msg = '晚上好！';
}
document.getElementById('welcome').innerText = msg;
</script>下次打开网页，它会自动跟你打招呼，像个小管家。
循环输出：快速生成列表
要是在网页上打印 1 到 5，总不能写五遍 document.write 吧？用 for 循环更省事：
<ul id="number-list"></ul>
<script>
const list = document.getElementById('number-list');
for (let i = 1; i <= 5; i++) {
const li = document.createElement('li');
li.innerText = '第 ' + i + ' 项';
list.appendChild(li);
}
</script>几行代码搞定一个动态列表，以后做菜单、日志都能用得上。
这些例子都不复杂，但已经涵盖了 JS 的核心：操作元素、定义变量、使用条件和循环。每天练一个，不出一周，你就能看懂大多数网页的“小动作”是怎么来的了。