Uncaught SyntaxError 表示JS解析失败，主因是语法错误（如括号/引号不匹配、非法字符、HTML混入JS等），需通过Console定位报错行，结合Sources面板查源码、Network查响应内容、Elements核对DOM结构，并排除BOM、编码、路径及CORS等问题。
检查浏览器控制台的 Uncaught SyntaxError 报错
这类错误通常意味着 HTML 文件里混入了非法 JavaScript 代码，或者 script 标签内容没写对。常见情况是：<script> 标签内直接写了未包裹在函数里的 JS 语句，但变量或函数名拼错、少了个引号、括号没闭合。
- 打开浏览器开发者工具（F12），切到「Console」面板，看第一行红字报错位置和提示
- 重点检查
<script>...</script>块内是否有document.getElementById("xxx")这类调用，而对应id="xxx"的元素还没加载（比如 script 放在<head>里） - 如果用了
type="module"，确保路径正确且服务器支持 CORS —— 直接双击打开index.html会触发CORS policy错误，必须用本地服务器（如python3 -m http.server）
404 Not Found 静态资源加载失败怎么定位？
图片、CSS、JS 路径写错是最常导致页面“看起来不对”但无明显报错的原因。浏览器控制台 Network 标签页里标红的请求就是线索。
- 检查
<link rel="stylesheet" href="css/style.css">中的href是否和实际文件路径一致：当前index.html在根目录，那css/文件夹就得真实存在且大小写匹配（Linux/macOS 区分大小写） - 相对路径以 HTML 文件所在位置为基准，不是以浏览器地址栏 URL 为准。比如用 VS Code Live Server 打开，地址是
http://127.0.0.1:5500/sub/index.html，那href="style.css"就会去找/sub/style.css，不是根目录下的 - 避免用
file:///协议打开 —— 此时fetch()或模块导入一律被浏览器拦截，连console.log都可能不执行
HTML 结构嵌套错误引发渲染异常
浏览器会自动“修复”不合法的 HTML，但修复结果不可控。比如在 <p> 里放 <div>，或把 <script> 写在 <head> 里却调用了 document.body，都可能让后续 DOM 操作失效。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 用浏览器的 Elements 面板查看最终渲染出的 DOM 树，对比你写的源码 —— 如果发现某段结构“消失”或位置突变，大概率是标签没闭合或嵌套违规
- 禁止在
<head>中使用document.write()，它会清空整个页面 -
<table>内部必须严格按<thead>/<tbody>/<tr>/<td>层级嵌套，少一层或多一个<div>都会导致表格错乱
字符编码与 BOM 头导致脚本静默失败
肉眼看不见的问题最麻烦。比如用 Windows 记事本保存 UTF-8 编码的 index.html，会自带 BOM（Byte Order Mark），某些旧版浏览器或构建工具会把它当作文本开头的非法字符，导致 JS 第一行报 Unexpected token ï。
立即学习“前端免费学习笔记（深入）”；
- 用 VS Code 打开文件，右下角看编码显示 —— 如果是
UTF-8 with BOM，点击切换成UTF-8并保存 - 检查
<meta charset="utf-8">是否在<head>最前面，且没有空格或注释挡在它前面 - 复制粘贴代码时特别小心：从网页、PDF 或微信文档里复制的引号可能是中文全角符号，
“和”代替英文"会导致 JS 解析失败，控制台可能只报Uncaught SyntaxError: Unexpected identifier，看不出哪错了
真正卡住的时候，别急着改逻辑 —— 先确认浏览器地址栏是不是 http:// 开头，再看 Console 里第一条红字是什么，最后用 Elements 面板点开 HTML 树，逐层比对你写的源码。很多“功能不工作”其实压根没走到 JS 那步。
