根本原因是浏览器未将文件识别为html，导致未启动渲染引擎；需检查扩展名、编码、doctype声明、打开方式及资源路径等。
页面空白或只显示代码文本
根本原因是浏览器没把文件当 HTML 解析，最常见于文件扩展名或编码问题。不是代码写错了，是系统压根没启动 HTML 渲染引擎。
实操建议：
- 确认文件后缀是
.html，不是.txt或无后缀；在记事本里保存时务必选“所有文件”类型，否则会偷偷加 .txt - 用 VS Code、Sublime 等编辑器打开，右下角检查编码是否为
UTF-8；若显示GBK或乱码，点击编码名 → “Reopen with Encoding” → 选UTF-8 - 确保首行是
，缺了它，IE 和部分旧浏览器直接切进怪异模式，连 <code>都可能被忽略 - 别用双击方式打开——很多系统默认用记事本打开
.html文件；应右键 → “在浏览器中打开”，或拖进 Chrome 标签页
图片/CSS/JS 显示 404 或样式丢失
资源路径错误占这类问题的 80% 以上，尤其在在线编辑器（如 JSFiddle、CodePen）或本地双击运行时高频出现。不是链接挂了，是你写的路径浏览器根本找不到。
实操建议：
- 在线编辑器里尽量用内联写法：CSS 写在
<style></style>里，JS 写在<script></script>里，彻底绕过路径问题 - 本地测试时，避免中文路径和空格，比如
我的图片.jpg改成my-image.jpg；大小写也要一致，Style.css≠style.css - 用浏览器 F12 → Network 标签页刷新，看哪些请求状态是
404；点开它，看 “Initiator” 列是谁发起的请求，快速定位是哪个src或href写错了 - 相对路径以 HTML 文件为基准：如果 HTML 在根目录，而 CSS 在
css/style.css，就写href="css/style.css"；别写成href="../css/style.css"（那是上级目录）
按钮点击无反应，控制台报 Cannot set property 'onclick' of null
这不是 JS 语法错，是 DOM 还没加载完，脚本就急着找元素。典型症状：代码放 里，或没加 defer，浏览器一边画页面一边执行 JS，自然找不到还没出生的按钮。
实操建议：
- 把
<script></script>标签移到前——这是最稳、无需动逻辑的解法 - 非要放
，就加defer属性：<script src="app.js" defer></script>；别用async，它不保证执行顺序 - 检查 ID 是否拼写一致：
id="submit-btn"对应getElementById('submit_btn')就是错的——短横线不是下划线 - 用
<button type="button"></button>，别用<div onclick="...">；后者不支持键盘操作，移动端也可能拦截点击 <h3>在线编辑器里代码正常，本地双击却失效</h3> <p>核心矛盾是浏览器的安全策略：本地 <code>file://协议下，现代浏览器禁止跨源加载资源（如 AJAX、某些字体、甚至部分<iframe></iframe>），也限制localStorage和一些 API 调用。不是你代码有问题，是环境权限不同。实操建议：
- 本地开发时，别双击，用轻量本地服务器：VS Code 装 Live Server 插件，右键 → “Open with Live Server”；或者命令行跑
npx http-server - Chrome 启动时加参数临时绕过（仅调试用）：
chrome.exe --unsafely-treat-insecure-origin-as-secure="file:///" --user-data-dir=/tmp/foo，但别长期依赖 - 检查控制台是否有
Not allowed to load local resource或Blocked loading resource from file URL类型报错，有就是这个原因 - 涉及
fetch、XMLHttpRequest的代码，在file://下基本不可用，必须走http://或https://
- 本地开发时，别双击，用轻量本地服务器：VS Code 装 Live Server 插件，右键 → “Open with Live Server”；或者命令行跑
