JavaScript 是让网页具备交互能力的核心脚本语言，基于原型、单线程运行，依赖事件循环处理异步，通过 DOM API 操作页面，需注意执行时序、作用域和异步链式处理。
JavaScript 不是网页的装饰品，它是让页面“活起来”的执行引擎——没有它，表单不能实时校验、按钮点击无响应、内容无法动态加载。
JavaScript 是什么：浏览器里能直接运行的脚本语言
它是一门轻量、解释型、基于原型的编程语言，由浏览器内置的 JavaScript 引擎（如 V8、SpiderMonkey）直接执行，不需要编译。它和 HTML、CSS 是网页三件套：HTML 定义结构，CSS 控制样式，JavaScript 负责行为。
关键点：
-
document.getElementById、addEventListener这类 API 只在浏览器环境存在，Node.js 里不可用（除非显式引入 DOM 模拟库） - 它默认运行在单线程中，靠事件循环（
Event Loop）处理异步操作，不是靠多线程并发 - 变量提升（hoisting）和作用域链（
scope chain）行为容易引发意外，比如var声明的变量在声明前可访问但值为undefined
怎么用 JavaScript 给按钮加点击反应
最基础的交互就是监听用户动作并触发逻辑。核心是绑定事件处理器，而不是写一堆内联 onclick="..."。
立即学习“Java免费学习笔记（深入）”；
推荐做法：
- 用
addEventListener而非onclick属性，避免覆盖已有监听器 - 把脚本放在
</body>前，或监听DOMContentLoaded，确保document已就绪 - 示例：
const btn = document.getElementById('submit-btn');<br>btn.addEventListener('click', function() {<br> console.log('按钮被点了');<br> this.disabled = true; // 防重复提交<br>});
为什么改了 DOM 页面却没更新
常见错觉是“代码执行了，但页面没变”，其实多数时候是 DOM 查询失败或更新时机不对。
典型原因：
- 用
getElementById查找元素时 ID 拼写错误，返回null，后续调用.innerHTML报错Cannot set property 'innerHTML' of null - 在元素插入 DOM 前就尝试操作它，比如
document.createElement('div')后直接.appendChild到一个还没存在的父节点 - 用
innerHTML插入含脚本的 HTML，新脚本不会自动执行；要用eval或动态创建<script>标签（不推荐）
fetch 请求成功但数据没显示出来
异步请求最容易掉进“以为代码顺序执行”的坑。JS 不会等 fetch 返回才跑下一行。
必须处理 Promise 链：
- 漏写
.then()或async/await，导致后续 DOM 更新语句在请求完成前就执行了 - 忘记检查
response.ok，HTTP 404 或 500 时response.json()仍会执行，但可能抛错 - 示例正确链路：
fetch('/api/user')<br> .then(res => {<br> if (!res.ok) throw new Error(res.status);<br> return res.json();<br> })<br> .then(data => {<br> document.getElementById('name').textContent = data.name;<br> })<br> .catch(err => console.error('加载失败:', err));
真正卡住人的往往不是语法，而是对执行时序、DOM 生命周期和异步模型的理解偏差——比如在 setTimeout 里反复查一个还没渲染出来的元素，或者以为 for 循环里的 i 在闭包中自动捕获了每次的值。
