双击打开html文件仅适用于纯静态页面；涉及fetch、import或相对路径时需用live server插件或http-server启动本地http服务，因file://协议会拦截网络请求和模块加载。
直接在浏览器里双击打开 .html 文件，是最简单、最可靠的效果查看方式——但仅限于纯静态页面；一旦用了 fetch()、import 或相对路径的 CSS/JS，就会白屏或报错，必须换方法。
双击打开后页面空白或乱码，先查这三件事
这不是代码写错了，而是文件保存或协议层面的问题：
- 保存时“另存为类型”必须选
所有文件，不是文本文档(.txt)——否则实际是index.html.txt，浏览器打不开 - 编码必须是
UTF-8（无BOM），Windows 记事本默认带 BOM，会导致中文乱码或页面顶部多出空白行 - 地址栏开头是
file:///就说明走的是本地文件协议，fetch和 ES 模块会被浏览器直接拦截，报错信息通常是Access to script at 'file://' is denied
想改完代码立刻看到效果，别手动刷新
保存 → 切浏览器 → 按 F5 是低效的。真正省事的方式只有两种：
- VS Code 安装
Live Server插件，右键 HTML 文件 →Open with Live Server，自动起服务并监听改动，地址是http://127.0.0.1:5500/ - 命令行进项目目录，执行
npx http-server -c-1（-c-1禁用缓存，避免样式改了不生效），服务地址默认是http://127.0.0.1:8080/
临时测试小片段，用浏览器开发者工具最快
不用存文件、不配环境，适合改一两行就看效果：
- 打开 Chrome 或 Edge，按
F12调出开发者工具 - 切到
Elements面板，右键任意元素 →Edit as HTML - 删掉原有内容，粘贴你的完整 HTML 片段（包括
、），回车即渲染 - 注意：这里改的是内存里的 DOM，关掉标签页就丢，不生成文件
真正容易被忽略的点是：很多新手以为“能预览=能运行”，但只要涉及网络请求、模块导入、Service Worker 或跨域资源，file:// 协议就完全失效——这时候不是代码有问题，而是根本没跑在 HTTP 环境下。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
