jQuery 的 globalEval 方法虽然代码量极少，却承担着一个非常明确的任务：将一段字符串形式的 JavaScript 代码放到全局作用域中执行。早期很多开发者会直接用 eval 来实现类似需求，但 eval 的致命问题是它会在当前调用作用域中运行，很容易把局部变量泄漏到全局，或者因为闭包环境导致代码无法正确访问全局对象。globalEval 通过动态创建一个 script 标签，把代码塞进这个标签的 text 属性里，再临时插入文档，最后立即移除，从而让浏览器按照“全局脚本”的规则去执行这段代码。整个过程对 script 标签的创建、插入、移除三个节点的控制，正是保证它稳定工作的关键。
globalEval 源码拆解：script 标签的创建与 text 属性写入
先来看 jQuery 中 globalEval 的典型实现。不同版本的 jQuery 有细微差异，但核心逻辑基本一致：首先调用 document.createElement 创建一个 script 元素节点，然后把传入的代码字符串赋值给 script.text 属性，接着把这个 script 元素追加到 head 节点中，最后立刻从文档中移除该元素。对应源码大致如下：
jQuery.globalEval = function( code ) {
var script = document.createElement( "script" );
script.text = code;
document.head.appendChild( script ).parentNode.removeChild( script );
};这里有一个非常值得注意的细节：jQuery 没有使用 script.innerHTML 或者 script.appendChild(document.createTextNode(code))，而是直接给 script.text 赋值。script.text 是 HTMLScriptElement 接口的属性，它在标准浏览器中能够直接设置脚本的文本内容，并且当脚本元素还没有插入文档时，修改 text 属性不会触发执行。这为后续控制执行时机提供了前提。如果使用 innerHTML，虽然也能写入代码，但某些旧版本浏览器会认为脚本已经被解析过，甚至可能抛出错误；如果使用 createTextNode 再 appendChild，代码会更加啰嗦，而且并不能带来额外收益。直接设置 text 属性是最简洁可靠的方案。
创建 script 元素后，代码并没有立即执行。DOM 中的 script 元素只有在被插入文档之后，浏览器才会启动解析和执行流程。这也正是 globalEval 能把“写入代码”和“执行代码”两个阶段彻底分开的原因。在需要执行多段动态代码时，可以先批量创建好多个 script 元素并写入 text，然后再按顺序插入文档，这种分离提供了更大的灵活性。当然 jQuery 本身没有暴露这种批量接口，但理解这一点对阅读源码很有帮助。
插入与移除的时机控制：为什么 appendChild 后要立即 removeChild
把 script 元素插入到 head 中的动作，是触发代码执行的那一个“开关”。浏览器遇到这种动态插入的 script 元素时，默认会同步解析并执行其中的代码，除非显式设置了 async 或 defer 属性。globalEval 没有设置这两个属性，所以 appendChild 调用返回之前，脚本代码通常已经执行完毕。紧接着调用 parentNode.removeChild 将 script 元素移除，这时候执行已经结束，移除操作不会中断代码运行，只是清理掉 DOM 中不再需要的节点。
为什么不直接保留这个 script 节点？首先，如果保留，每次执行动态代码都会在 head 中堆积一个空的 script 元素，久而久之会影响 DOM 树的整洁度和内存占用。其次，某些浏览器的调试工具会把这些动态插入的脚本列在 Elements 面板中，保留节点会让开发者困惑。最重要的是，移除这个动作还能防止后续代码误操作这个已经被执行过的 script 元素，例如错误地修改其 text 属性或再次触发执行。因此，插入后立即移除是一种干净且必要的资源管理策略。
还有一种更隐蔽的执行时机问题：如果代码内部包含异步调用，比如 setTimeout 或者 Promise，那么 script 元素被移除的时候，这些异步回调可能还没有执行。但这并不影响回调本身的作用域环境。因为 script 元素执行完毕之后，其代码的全局作用域链已经建立，异步回调在注册时已经捕获了正确的上下文，后续的移除操作不会破坏它们。不过需要清楚，globalEval 的同步特性只保证代码块的“同步部分”执行完成，异步任务仍然要等待事件循环的调度。
与 eval、Function 的对比：作用域差异与调试体验
很多开发者会问：为什么不直接用 eval 执行字符串？eval 在直接调用时，会在当前函数作用域中执行代码。这意味着被执行的代码可以访问调用者的局部变量，并且如果代码中声明了变量（不使用 var/let/const 时）还会把变量泄漏到全局；更麻烦的是，如果调用者函数结束，闭包被销毁，原本希望通过 eval 执行的全局代码可能会引用到已经消失的局部环境。Function 构造器则不同，它在非严格模式下创建的函数总是在全局作用域中执行，相当于 new Function(code) 可以获取全局变量，但不能访问调用者的局部变量。但 Function 构造器有一个限制：它不能执行包含 return 语句的顶层代码，而且 new Function 每次都会创建一个新的函数对象，性能上不如直接执行 script 元素。
globalEval 创建的 script 元素执行环境和普通的全局脚本完全一致，它既可以访问全局变量，也可以使用顶层 return（尽管在全局脚本中 return 会报错，但至少语法上允许），而且代码抛出的异常会以全局脚本异常的形式上报，调试时在 Sources 面板中能看到对应的脚本内容，定位问题比 eval 和 Function 要轻松得多。这一点对大型项目的动态代码调试尤为重要。
下面是一段模拟对比的示例，展示了 eval 和 globalEval 在变量可见性上的差异：
function testEval() {
var localValue = 10;
eval( "console.log( localValue );" ); // 输出 10，eval 能访问局部变量
}
function testGlobalEval() {
var localValue = 10;
// 使用 globalEval 时，代码在全局作用域中执行，无法访问 localValue
jQuery.globalEval( "console.log( typeof localValue );" ); // 输出 undefined
}
testEval();
testGlobalEval();从上面的对比可以直观看到，eval 把代码塞进了当前函数作用域，而 globalEval 则完全切断了与调用者作用域的关联。在需要执行第三方脚本片段、但又不希望它干扰主应用闭包变量的场景中，globalEval 是更安全的选择。
实际使用中的坑：文档就绪、内容安全策略与错误处理
globalEval 依赖 document.head 节点，如果代码在文档加载早期执行，比如 head 还没解析出来，document.head 可能是 null。jQuery 源码中通常会使用 document.head || document.documentElement 来兜底，但在某些极端情况下，document.documentElement 可能也尚未完全可用。因此，如果项目在 DOMContentLoaded 之前就调用 globalEval，需要自己保证插入目标节点存在。一个常见的做法是优先使用 document.head，如果不存在则退回 document.getElementsByTagName("head")[0]，再不行则使用 document.documentElement.appendChild。
另一个大坑是现代浏览器启用的内容安全策略（CSP）。很多生产环境会配置 script-src 指令，禁止内联脚本执行，比如 script-src 'self' 就不允许动态插入的 script.text 代码运行，即使是静态内联脚本也会被拦截。jQuery 的 globalEval 在这种情况下会静默失败或是抛出违反 CSP 的错误，这取决于浏览器的实现。如果你的项目需要严格的 CSP，但又必须动态执行代码，就需要改用其他方案，比如通过 Web Worker 或者预先加载好的脚本文件，并评估安全风险。
错误处理方面，globalEval 执行的代码如果抛出未捕获的异常，这个异常不会在调用 globalEval 的 try-catch 块中被捕获。因为 script 元素的执行发生在 DOM 操作内部，错误冒泡到全局错误处理程序。开发者如果需要捕获动态代码的错误，可以在代码字符串外层包一层 try-catch，例如传入 "try { ... } catch(e) { console.error(e); }"，或者为 window 注册 error 事件监听。这跟 eval 的行为有显著区别，eval 抛出的异常可以直接被调用者捕获。
总体来看，jQuery 的 globalEval 通过极其精简的 DOM 操作，巧妙地解决了动态代码全局执行与时机控制的难题。理解它内部对 script 标签创建、插入、移除的每一步控制，不仅能帮助你更深入地掌握浏览器脚本加载机制，也能在需要自己实现类似功能时避开作用域、安全和调试方面的坑。
jQueryglobalEvalscript标签修改时间：2026-10-03 12:11:32