HTML文件改名只需保留.html后缀，如index_old.html→home.html；改元素属性需同步更新引用、CSS和JS，优先用classList API操作class。
HTML 文件名怎么改？直接重命名就行
HTML 文件本身只是文本文件，改名和改一个 Word 或图片文件没区别——只要不破坏后缀名 .html（或 .htm），系统和浏览器就能正常识别。常见错误是只改了前半部分，却把 .html 一起删了，结果双击打不开，或者服务器返回 404。
- ✅ 正确：把
index_old.html改成home.html - ❌ 错误：改成
home（漏掉后缀）、home.htmml（拼写错误）、home.HTML（Windows 通常不敏感，但 Linux/服务器严格区分大小写） - ⚠️ 注意：如果这个 HTML 文件被其他页面用
<a href="index_old.html">或<script src="index_old.html">引用，改名后必须同步更新所有引用路径，否则链接失效
想改页面里某个元素的“名称”？先分清 name、id、class、tag
HTML 中没有“元素名称”这个统一概念，常被误称的其实是以下几种属性，作用完全不同：
-
name：主要用于表单控件（<input>、<select>），提交时作为键名。例如<input name="user_email">提交后后端收到user_email=xxx -
id：全局唯一标识，用于 CSS 定位（#my-btn）、JS 获取（document.getElementById("my-btn")）。改id时，务必检查所有 JS 和 CSS 是否还匹配 -
class：可复用的样式/行为标记，改它一般只需同步对应 CSS 规则（如把class="btn-primary"改成class="btn-main"，就得确认.btn-main已定义） - 标签名（如
<div>→<section>）：语义化调整，不影响功能，但可能改变默认样式或无障碍支持，需测试渲染和屏幕阅读器表现
用 JavaScript 动态改元素的 id 或 class 怎么写？
不能用“重命名元素”这种说法——DOM 元素本身不能改名，但可以改它的属性值。最常用的是 id 和 className（注意不是 class，因为 class 是保留字）。
const el = document.querySelector("button");
el.id = "submit-btn-new"; // 直接赋值改 id
el.className = "btn btn-success"; // 覆盖整个 class 字符串
el.classList.add("is-active"); // 推荐：追加 class，不覆盖已有
el.classList.remove("btn-primary"); // 移除指定 class
⚠️ 避坑：别写 el.class = "xxx"（语法错），也别在循环中反复用 el.className = ... 拼接，容易丢样式；优先用 classList API。
立即学习“前端免费学习笔记（深入）”；
为什么改完名字页面看起来没变化？
改了文件名、id 或 class 后页面“没变”，往往是因为：
- 浏览器缓存了旧版本：强制刷新（
Ctrl+Shift+R或Cmd+Shift+R），或禁用缓存调试 - JS 里用了硬编码选择器但没更新：比如原来
document.getElementById("old-id")，改了id却忘了改这行代码，JS 就静默失败 - CSS 里写了
#old-id { ... }但没同步改成新id，样式自然不生效 - 构建工具（如 Webpack/Vite）把 HTML 当作模板处理，实际输出的文件名由配置控制，手动改源文件名无效
真正要改的，永远是“谁在用它”和“谁在找它”——而不是单方面给东西换个名字就完事。
