结论：<script>标签本身不定义作用域，仅作为脚本执行容器；真正创建作用域的是函数、if、for、{}等JS语法结构，其中函数形成函数作用域，let/const配合{}形成块级作用域，全局作用域由页面环境提供且多个<script>共享。
直接说结论：<script> 标签本身不定义区块作用域，真正起作用的是函数、if、for、{} 这些语法结构，而 <script> 只是脚本执行的容器——它既不创建作用域，也不嵌套作用域。
为什么 <script> 嵌套 function 不等于“区块作用域”
很多人看到 <script> 里写 function outer() { function inner() {} }，就以为外层 <script> 和内层 function 构成了“区块嵌套关系”。其实不是：
-
<script>标签只是把 JS 代码加载进当前执行环境，它的边界对 JS 引擎来说没有语义意义 - 真正形成作用域的是
function、if（ES6+ 的let/const）、for、{}等语言结构 - 多个
<script>标签之间默认共享全局作用域，除非用 IIFE 或模块包裹
用 function 和 {} 显式划分区块作用域
要定义可复用、隔离的“网页区块作用域”，得靠 JS 本身的嵌套能力，而不是 HTML 标签排列：
- 函数作用域：用
function包裹逻辑，变量自动限制在内部，比如function renderHeader() { const el = document.getElementById('header'); ... } - 块级作用域：ES6+ 中用
let/const+{}，例如if (condition) { const apiURL = '/v1/users'; fetch(apiURL); }——apiURL在块外不可访问 - 避免污染全局：不用
var声明，不裸写counter = 0（这会挂到window.counter）
常见错误：误把 <script> 当作作用域分隔符
下面这些写法看似“分区”，实际毫无作用域隔离效果：
- 连续多个
<script>标签，但都用var声明同名变量 → 全局覆盖，不是隔离 -
<script> function initCart() { ... } </script>和<script> initCart(); </script>分开写 → 仍共享全局，且依赖执行顺序 - 在
<script>内写if但用var→var会被提升，块内声明等价于函数顶部声明
真正安全的做法是：每个逻辑区块封装成独立函数或模块，用 let/const + 显式 {} 控制可见性，必要时用 export / import 或 IIFE 隔离。
最容易被忽略的一点：HTML 结构（比如多个 <div id="sidebar">）和 JS 作用域完全无关——你不能靠 DOM 层级推断变量是否可访问。作用域只由 JS 代码的嵌套结构决定，不是由 <script> 的位置或数量决定。
