<noscript>仅在JS被禁用或脚本因MIME错误/网络中断未执行时生效，不响应JS语法错误；应置于<div id="root">后并显式设display:block，内容须纯HTML且提供真实替代路径，测试须用浏览器原生禁用JS功能。
noscript 标签只在 JS 被禁用或加载失败时生效
它不是“JS 不可用时的备选逻辑”，而是浏览器明确检测到脚本被禁用、或因 MIME 类型错误/网络中断导致 <script> 未执行时才渲染其内容。如果用户只是写了有 bug 的 JS，<noscript> 不会触发——这点常被误判。
常见错误现象：<noscript>请启用 JavaScript</noscript> 放在页面顶部，但用户开了 JS 却仍看到提示，大概率是页面其他地方存在语法错误导致整个 JS 环境提前终止（比如顶层 throw 或 import 失败），此时浏览器仍认为 JS 已加载，<noscript> 被跳过。
- 确保
<noscript>出现在<head>或<body>有效位置，不能嵌套在<script>或其他无效父元素中 - 不要依赖它做功能降级（如渲染表格替代图表），它只适合轻量引导或静态信息补充
- 若需兼容 JS 加载中状态，得配合
defer+loading类或服务端渲染，<noscript>本身不感知加载过程
noscript 里放什么内容才算真正有用
纯文字提示（如“请启用 JavaScript”）价值极低，用户要么已知、要么无法操作。真正有效的做法是提供可立即使用的替代路径：
- 指向一个无 JS 也能完成核心任务的纯 HTML 页面（如
<a href="/fallback-login">文本登录</a>） - 展示静态关键信息：订单号、错误码、联系邮箱（避免“请联系客服”这种空泛表述）
- 内联一个最小化表单：
<form action="/submit" method="post"><input name="query"><button type="submit">搜索</button></form>
注意：里面不能出现 <script>、onclick、href="javascript:" 等任何 JS 相关内容，否则会被忽略——浏览器会直接丢弃整块 <noscript>。
立即学习“前端免费学习笔记（深入）”；
与现代框架共存时 noscript 容易失效
React/Vue 应用常把整个 UI 渲染到一个空 <div id="root"></div> 中，而 <noscript> 若放在 <body> 底部，可能被框架 mount 时清空；若放在 <head>，又无法作为可见内容呈现。
- 推荐位置：紧贴
<div id="root">后面，且用display: block显式声明（某些 CSS 重置会默认隐藏<noscript>） - 避免用框架组件包裹它——
<noscript>是 HTML 原生机制，必须原样保留在 DOM 中 - SSR 场景下，服务端不应渲染
<noscript>内容（因为服务端不知客户端 JS 状态），应留给客户端决定是否显示
测试 noscript 是否真起作用的可靠方法
浏览器开发者工具里的“禁用 JavaScript”开关（Chrome DevTools → Settings → Debugger → “Disable JavaScript”）是唯一可信方式。其他手段都不准确：
- 断网后刷新 ≠ JS 禁用，
<noscript>不触发 - 用插件屏蔽 JS（如 NoScript）可能拦截不完全，部分脚本仍执行
- 移动端 Safari 隐私模式下 JS 默认开启，仅靠隐私浏览不能模拟
测试时务必关闭所有扩展、使用干净隐身窗口，并确认地址栏左上角出现“JS 已停用”提示（Chrome）或类似标识。否则你看到的永远是 JS 正常运行时的页面。
最常被忽略的是：很多团队只测桌面 Chrome，却没验证 Firefox 的严格 MIME 检查（比如返回 text/plain 的 JS 文件会导致整个脚本块被忽略，从而激活 <noscript>）——这种边缘情况恰恰是用户真实遇到的。
