HTML文件打不开的根本原因是file://协议限制及文件关联错误；应启用扩展名确认.html后缀、设置浏览器为默认程序、拖入浏览器或用Live Server启动HTTP服务规避安全策略。
直接双击或拖入浏览器打不开 HTML 文件？先确认文件路径和扩展名
很多用户遇到“右键没‘在浏览器中打开’选项”，本质不是菜单缺失，而是系统没把 .html 或 .htm 文件关联到浏览器，或者文件本身根本不是合法 HTML——比如后缀被隐藏、实际是 .txt 或 .html.txt。Windows 默认可能用记事本打开，Mac 可能用预览，都不执行 HTML 渲染。
- 在文件资源管理器（Windows）或访达（Mac）中，启用「显示文件扩展名」，确认文件名结尾确实是
.html，不是.html.txt - 右键 → 「属性」（Windows）或「显示简介」（Mac），检查「打开方式」里默认程序是不是 Chrome / Edge / Safari 等真实浏览器，而不是文本编辑器
- 如果默认程序不对：右键 → 「打开方式」→ 选浏览器 → 勾选「始终使用此应用打开 .html 文件」
右键菜单真没“在浏览器中打开”？手动加个快捷方式最可靠
Windows 的上下文菜单不自带该选项，第三方工具（如 Open with Browser）容易过时或带捆绑软件；Mac 的服务菜单又藏得深。更稳的方式是绕过右键，用拖放或地址栏输入本地路径。
- 把
.html文件直接拖进已打开的 Chrome / Edge / Firefox 窗口标签页区域（不是地址栏） - 在浏览器地址栏粘贴完整本地路径，例如：
file:///C:/project/index.html（注意是三个斜杠，且盘符大写） - Mac 用户路径格式为：
file:///Users/username/Desktop/page.html（开头三个斜杠，空格需编码为%20）
开发时频繁刷新，别依赖右键——用 Live Server 扩展一劳永逸
手动拖放或输路径适合单次查看，但写代码时改一行就要重拖一次，效率极低。VS Code 用户应立刻装 Live Server 扩展（作者 Ritwick Dey），它起一个本地 HTTP 服务，自动刷新，且规避了 file:// 协议下 AJAX、ES Module 等功能受限的问题。
- VS Code 中按
Ctrl+Shift+X（Win）或Cmd+Shift+X（Mac），搜Live Server并安装 - 右键任意
.html文件 → 点击Open with Live Server，浏览器会自动打开http://127.0.0.1:5500/xxx.html - 此后每次保存文件，页面自动刷新；且
fetch('./data.json')、import模块等都能正常工作
为什么不用双击？因为 file:// 协议有硬性限制
双击打开走的是 file:// 协议，现代浏览器对其做了严格限制：无法发起跨源请求、不能读取本地 XMLHttpRequest、ES6 import 会报 CORS 错误、某些 API（如 navigator.geolocation）直接禁用。这不是设置问题，是安全策略，改不了。
立即学习“前端免费学习笔记（深入）”；
- 错误示例：
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/plain".
- 这类报错只在
file://下出现，换成http://127.0.0.1（哪怕只是本地服务）就消失 - 所以「强制用浏览器打开」的真正含义，不是绕过系统关联，而是绕过
file://协议本身
