jQuery jQuery.globalEval() Method

What You’ll Learn

The jQuery.globalEval() utility executes a JavaScript string in the global scope — unlike eval() inside a function. This tutorial covers syntax, official examples, scope comparisons, CSP nonce support, iframe context, security rules, and how jQuery uses it internally.

Introduction

Sometimes JavaScript must run from a string rather than a <script src> file — legacy AJAX responses, dynamically inserted HTML with inline scripts, or plugin bootstrapping. The challenge is scope: code run with plain eval() inside a function stays local to that function.

jQuery provides jQuery.globalEval() (also written $.globalEval()) to execute strings in the global context — the same place normal page scripts run. jQuery itself uses this when processing <script> tags in injected markup. Because it runs arbitrary code, treat it as a power tool: useful for learning and maintenance, dangerous with untrusted input.

Understanding the jQuery.globalEval() Method

jQuery.globalEval(code) takes a string of JavaScript and executes it so that var declarations and function definitions become globals — accessible as properties of window in browsers.

Since jQuery 3.4 you can pass { nonce: "..." } for Content Security Policy. Since jQuery 3.5 you can pass a doc argument to evaluate in an iframe’s document context.

📝 Syntax

Three forms of jQuery.globalEval:

// Basic (since jQuery 1.0.4)

jQuery.globalEval( code )



// With CSP nonce (since jQuery 3.4)

jQuery.globalEval( code, { nonce: "nonce-abc123" } )



// With target document (since jQuery 3.5)

jQuery.globalEval( code, options, doc )

Parameters

• code — string of JavaScript to execute globally.
• options (optional) — plain object; nonce for CSP-compliant scripts.
• doc (optional) — document whose global context should run the code.

Return value

• Generally undefined — side effects (globals, DOM changes) are the purpose.

Official minimal example

function test() {

  jQuery.globalEval("var newVar = true;");

}

test();

// newVar === true (global)

Examples Gallery

Each example uses trusted, hard-coded strings only — never replicate these patterns with user input. Open DevTools or use the Try-it links to run them interactively.

function test() {

  jQuery.globalEval("var newVar = true;");

}

test();



console.log(typeof newVar !== "undefined"); // true

console.log(newVar); // true

true

true

function demo() {

  $.globalEval("var fromGlobalEval = 'global';");

  eval("var fromEval = 'local';");

  console.log(fromEval); // local — works here

}

demo();



console.log(typeof fromGlobalEval !== "undefined"); // true

console.log(typeof fromEval !== "undefined");       // false

local

true

false

var script = [

  "window.demoCounter = 0;",

  "window.incrementDemo = function() {",

  "  window.demoCounter++;",

  "  return window.demoCounter;",

  "};"

].join("\n");



$.globalEval(script);

console.log(incrementDemo()); // 1

console.log(incrementDemo()); // 2

1

2

function test() {

  jQuery.globalEval("var cspVar = true;", {

    nonce: "nonce-2726c7f26c"

  });

}

test();

console.log(cspVar); // true

true

// Avoid: $.globalEval(userInput) — XSS!



// Better: load a trusted file

function loadScript(src) {

  return $.getScript(src); // jQuery handles script element

}



// Best: ES modules in modern apps

// import { init } from './widget.js';



console.log("Use getScript or modules — not user strings");

Use getScript or modules — not user strings

🚀 Common Use Cases

• Injected <script> tags — jQuery internal use in .html() / .append().
• Legacy AJAX script responses — execute returned JavaScript globally.
• Plugin bootstrapping — define window-level APIs from strings.
• iframe scripts — pass doc for child document context (3.5+).
• CSP-compliant eval — pass nonce when policy requires it.
• Reading jQuery source — understand dynamic script execution paths.

📝 Notes

• Available since jQuery 1.0.4 — nonce since 3.4, doc since 3.5.
• Never pass user-controlled strings — treat as arbitrary code execution.
• Differs from eval() — always global scope, not caller scope.
• jQuery uses this internally when DOM methods encounter inline scripts.
• Prefer $.getScript() or <script src> for loading external files.
• CSP may block inline eval entirely — design policies accordingly.
• Related: $.getScript(), DOMEval (internal), .html().

💡 Best Practices