¿Cuáles son las maneras de cargar JavaScript o CSS sin ejecutarlos?

Question

Soy consciente de la carga dinámica de script/css al agregar <style> o <link> etiquetas a la cabeza o al cuerpo de la página, pero luego se ejecutará mediante el navegador una vez descargado. Estaba pensando en otras formas de descargar pero no ejecuto el código javascript/css. En primer lugar lo que viene en mi mente era XMLHttpRequest:

//simple execution received script 
var executeScript = function(code){ 
    eval(code); 
}; 
//create XMLHttpRequest in cross-browser manner 
var xhr = createXMLHTTPObject(); 
//check whether file is loaded 
var checkStatus = function(){ 
    if(xhr.readyState == 4){ 
     if(xhr.status >= 200 && xhr.status < 300 || xhr == 304){ 
      executeScript(xhr.responseText); 
     } 
     else {//error 
     } 
    } 
}; 
//do request 
xhr.open('get','http://podlipensky.com/examples/dynamicscript/hey.js', true); 
xhr.onreadystatechange = checkStatus; 
xhr.send(null); 

Pero en este caso estamos limitados con los scripts desde el mismo dominio, debido a la política del mismo origen (aunque podemos tratar de solucionar con CORS)

Otro enfoque, en el que estaba pensando es agregar dinámicamente iframe a la página y luego agregar la etiqueta script al iframe, por lo que el script se ejecutará una vez que se descargó, pero ocurre en el contexto de otra página - iframe.

¿Hay alguna otra forma de descargar y ejecutar el script?

ACTUALIZACIÓN:

Una de las razones por las que sería útil para descargar, pero no ejecutar javascript/css es pre-carga de bibliotecas de terceros, sino que los utilizan sólo en la demanda.

Answer 1

También puede usar un iframe y usar el script/css URL como el src del marco (por lo que no se evalúa/aplica en absoluto), aunque querrá estar seguro de que en ese caso el JavaScript/CSS se entregó con Content-Type text/plain para evitar que cosas desafortunadas ocurrieran con los caracteres < y tal. Aunque también debe encontrarse con problemas de SOP con este enfoque, en un navegador decente, si el iframesrc es de un origen diferente.

Aparte de eso, creo que en gran medida lo tienen cubierto con las opciones que enumera.

Answer 2

Si su script simplty define una función, entonces puede ejecutarse sin ejecutar nada. Por supuesto, esto requeriría la colaboración de ambos lados ala JSONP

//jsonp 
var result = {/*...*/}; 

//missingnonp 
var f = function(){ /**/ }; 

Answer 3

Suponiendo que permite controlar el servidor que ofrece la página, en la que se desea cargar la JS en cuestión, la forma más fácil es enviar el URL a través de AJAX a su servidor, cárguelo desde allí (por ejemplo, a través de PHP file_get_contents ($ url);) y recupérelo como resultado de la llamada AJAX.

Answer 4

Sólo descubierto una opción más para cargar script/CSS de forma asíncrona (sin entrar en conflicto con SOP) - es el uso de <object> etiqueta:

<object data="http://podlipensky.com/examples/dynamicscript/hey.js" /> 

encontrado este enfoque here. Así que solo estoy compartiendo mis hallazgos, espero que sea útil.