Fondo:

El segundo argumento de "contexto" a la llamada del selector jQuery (por ejemplo:jQuery(selector, context)) se puede proporcionar para dar al motor selector un punto de partida desde el cual descender.

Esto suele ser útil si necesita controlar el contenido en un IFRAME (en el mismo dominio). Simplemente pasasiframe.contentWindow.document como el argumento del "contexto".

Si se carga algún código JavaScript en el IFRAME que utiliza jQuery, y esLLAMADO DESDE EL ÁMBITO DE LA VENTANA EXTERNA, entonces cualquier referencia a$ ojQuery en ese código será en realidad la instancia dejQuery Desde la ventana exterior.

El problema surge cuando el código JavaScript de IFRAME (por ejemplo, Bootstrap.js) hace algo como$(document) (o hace algún otro selector sin un argumento de "contexto"). Cuando ese código (definido dentro del iframe) se llama desde la ventana exterior,document se refiere al elemento HTMLDocument de la ventana exterior, que generalmente no es el resultado deseado.

Pregunta:

Sería muy útil poder crear una copia / envoltura de jQuery con alcance léxico que tenga un argumento de "contexto" predeterminado, proporcionado por quien lo crea.

Ejemplo:

// jQuery already exists out here
var iframe = document.createElement('IFRAME');
iframe.addEventListener('DOMContentLoaded', function(){

    // code in here can already refer to $ for 'outer' jQuery

    // code in here can refer to $local for 'inner' jQuery by virtue of...
    var $local = jQueryWithContext($, iframe.contentWindow.document);

    // code loaded with IFRAME will use $local by virtue of ...
    iframe.contentWindow.jQuery = iframe.contentWindow.$ = $local;

});
iframe.src = '/path/to/iframe/content.html';

La pregunta es, ¿es posible escribir algo comojQueryWithContext ¿encima?

¿Por qué?

A veces desea aislar componentes HTML de terceros que (aunque confía en ellos desde una perspectiva de seguridad) se comportan mal desde una perspectiva de contaminación CSS / JavaScript.

Bootstrap.js es un buen ejemplo. Llama$(document) un poco justo, y hace otras llamadas de selector sin contexto similares. Si jQuery pudiera ser rediseñado de la manera que lo describo, entonces estas bibliotecas escritas "no de manera óptima" podrían aislarse con bastante facilidad.

Además, puede ser muy útil usar el mismo$.data(el, ...) colección de ambos marcos, y esto es bastante complicado sin un poco de gestión de contexto.