sencillos - lo basico de javascript

¿Usar JavaScript para evitar que una etiqueta `<script>` posterior sea evaluada?

Question

Este es un caso un tanto extraño, pero tengo mis razones:

Me gustaria poder escribir

<script type="text/javascript" src="first.js"></script>
<script type="text/javascript" src="second.js"></script>

en mi marca y, utilizando el código en first.js , impida o retrase la ejecución de second.js . ¿Es esto posible, en cualquier navegador? ¿Qué pasa si los contenidos de first.js están en línea? (Si ayuda, asuma que la segunda etiqueta de script tiene un atributo de id ).

Desde que obtuve un par de respuestas que no entendí a lo que me refería, debo aclarar:

1. La solución debe estar completamente dentro de first.js . Cualquier cosa que requiera cambios en el HTML original de la página, o en second.js , no es aceptable.
2. Es aceptable cargar second.js través de Ajax y ejecutarlo usando eval . Esa es la parte fácil. La parte difícil es evitar la ejecución inmediata de second.js .
3. Supongamos que no sabes lo que hay en second.js . Por lo tanto, no puede reemplazar cada función global llamada por second.js con una función sin second.js . (Además, esto casi con seguridad llevaría a errores).

Si conoces una solución que funciona en algunos navegadores pero no en otros, me encantaría escucharla.

Ejemplo : para hacer esto un poco más concreto, digamos que el código

<script type="text/javascript">
function func() {
window.meaningOfLife = 42;
window.loadSecond();
};
setTimeout(func, 10);
</script>

precede que los dos script incluyen, y que second.js contiene la línea

if (window.meaningOfLife !== 42) {throw new Error();}

first.js debería poder evitar este error retrasando la second.js de second.js hasta que se ejecute window.loadSecond . (Suponga que la implementación de window.loadSecond también se encuentra en first.js ). No está permitido tocar window.meaningOfLife .

Actualización : la respuesta de Alohci cumple estos requisitos, pero solo con la condición de que la segunda etiqueta de secuencia de comandos venga inmediatamente después de la primera, con nada más que espacios en blanco entre ellos. Si alguien pudiera extender su pirateo para evitar ese requisito, sin introducir otras consecuencias no deseadas, sería increíble ...

Answer 1

El siguiente article describe la forma en que podría bloquear (terceros) la carga / ejecución de scripts desde su script (incluidas las etiquetas en el encabezado de la página y las etiquetas agregadas dinámicamente).

Para manejar las etiquetas existentes en una página:

1. Use un MutationObserver para observar la inserción de los elementos del script y dentro del mutationObserver, haga una copia de respaldo del script (para habilitarlo / insertarlo más tarde) y cambie el tipo de script a "javascript / blocked" (no funciona en IE, Edge, Firefox). También puede manejar el evento beforescriptexecute en desuso (pero en funcionamiento) en Firefox para evitar la carga de scripts.
2. Configure manualmente el tipo "javascript / bloqueado" (funciona en todas partes, incluidos IE y Edge) como <script type="text/javascript" type="javascript/blocked" src="second.js"></script> , luego <script type="text/javascript" type="javascript/blocked" src="second.js"></script> copia de seguridad MutationObserver devuelve la llamada y la vuelve a agregar más tarde.

Para manejar etiquetas agregadas dinámicamente.

1. Mono-parche el documento.createElemento .
2. Reemplace los descriptores ''src'' y ''type'' en el prototipo HTMLScriptElement.

Además, estos chicos proporcionan una biblioteca aún con el enfoque descrito en el artículo.

Answer 2

En first.js , establece var shouldILoad = true

Entonces, cargue second.js esta manera:

<script>
if (shouldILoad) {
(function() {
var myscript = document.createElement(''script'');
myscript.type = ''text/javascript'';
myscript.src = (''second.js'');
var s = document.getElementById(''myscript'');
s.parentNode.insertBefore(myscript, s);
})();
}
</script>

(donde ''myscript'' es el ID de algún elemento antes del cual desea insertar el nuevo elemento Script)

Answer 3

Por lo que sé, no puedes. Si el marcado se parece a

<script type="text/javascript" src="first.js"></script>
<script type="text/javascript" src="second.js"></script>

no puede acceder al segundo elemento de secuencia de comandos desde first.js , ya que no se ha agregado al DOM en el momento en que se ejecuta la primera secuencia de comandos (incluso si asigna un id al segundo elemento). No importa si el código de second.js se coloca en línea o en un archivo externo.

Lo único que no entiendo es tu segundo punto. Primero dice que no puede controlar el marcado del documento, pero luego second.js que es posible cargar second.js dinámicamente (utilizando AJAX).

Answer 4

Solo para ver si esto era posible, first.js tuve que first.js envió un XHR síncrono a un archivo PHP, e second.js archivo PHP eliminara el second.js . Cuando el readyState alcanzó el ''4'', hice que JS alertara algo, para detener el hilo. Luego fui y revisé el servidor ... Sí, se eliminó second.js . Y sin embargo, no funcionaría. Cerraría el cuadro de alerta y el código que estaba en second.js todavía se ejecutaría, a pesar del hecho de que el archivo se había ido.

Realmente no sé qué significa esto, pero la respuesta a su pregunta probablemente sea: "No, no es posible".

Answer 5

Teniendo en cuenta el conjunto de requisitos específicos, esto es bastante simple y debería funcionar completamente en todos los navegadores. Sin embargo, sí requiere que first.js preceda inmediatamente a second.js sin nada entre ellos excepto el espacio en blanco.

Primero, asumamos que el HTML se ve así:

<!DOCTYPE html>
<html>
<head>
<title>Test Case</title>
<meta charset="UTF-8" />
<script type="text/javascript">
function func() {
window.meaningOfLife = 42;
window.loadSecond();
};
</script>
<script type="text/javascript" src="first.js"></script>
<script type="text/javascript" src="second.js"></script>
</head>
<body>
<p>Lorem ipsum dolor sit amet ...</p>
<a href="javascript:func()">Run Func()</a>
</body>
</html>

He eliminado el setTimeout porque eso puede hacer que func () se ejecute antes de que start.js se ejecute y provoque un error "loadSecond no está definido". En su lugar, proporcioné un ancla para hacer clic en para ejecutar func ().

Segundo, asumamos que second.js se ve así:

document.body.appendChild(document.createTextNode("second.js has run. "));
if (window.meaningOfLife !== 42) {throw new Error();}

Aquí, acabo de agregar una línea para agregar texto al cuerpo del documento, para que sea más fácil ver cuándo se ejecuta second.js.

Entonces la solución para first.js es esta:

function loadSecond()
{
var runSecond = document.createElement("script");
runSecond.setAttribute("src", "second.js");
document.body.appendChild(runSecond);
}
document.write("<script type=''application/x-suppress''>");

La función loadSecond está ahí para ejecutar second.js cuando se ejecuta func ().

La clave de la solución es la línea document.write . Se inyectará en el HTML <script type=''application/x-suppress''> entre la etiqueta de script close de first.js y la etiqueta de script open de second.js.

El analizador verá esto e iniciará un nuevo elemento de script. Debido a que el atributo de tipo tiene un valor que no es uno que el navegador reconoce como JavaScript, no intentará ejecutar su contenido. (Por lo tanto, hay un número infinito de posibles valores de atributos de tipo que podría usar aquí, pero debe incluir un atributo de tipo, ya que en su ausencia, el navegador asumirá que el contenido del script es JavaScript).

La etiqueta de apertura de la secuencia de comandos second.js se analizará como contenido de texto del nuevo elemento de la secuencia de comandos y no se ejecutará. Finalmente, la etiqueta de cierre de la secuencia de comandos second.js se volverá a proponer para cerrar el nuevo elemento de secuencia de comandos, lo que significa que el resto del HTML se analiza correctamente.

Puede ver una versión de trabajo en http://www.alohci.net/static/jsprevent/jsprevent.htm

Answer 6

Todas las etiquetas <script> tienen su propio contexto de ejecución , lo que hace que sea casi imposible interferir entre sí. Por supuesto que tienes el objeto global (infame) (referenciado por la window en los navegadores).

Prevenir la ejecución de second.js es bastante simple: ¡ rómpelo ! Suponiendo que second.js intenta llamar a document.getElementById por ejemplo:

Ejemplo de trabajo de romper jQuery, luego cargarlo más tarde (con dependencias).
Probado en: IE 6+, FF 3.6+, Chrome

fin de first.js

var execute;
// saving our position
var scripts = document.getElementsByTagName("script");
var i = scripts.length;
// breaking getElementById
var byId = document.getElementById;
document.getElementById = null;
var interval = setInterval(function () {
if (i != scripts.length) {
var second = scripts[i];
// stop polling
clearInterval(interval);
// fix getElementById
document.getElementById = byId;
// set the delayed callback
execute = function (onload) {
var script = document.createElement("script");
script.src = second.src;
script.onload = script.onreadystatechange = onload;
document.getElementsByTagName("head")[0].appendChild(script);
};
}
}, 100);

Cada vez que quieras ejecutar second.js

execute(function(){
// second.js dependant code goes here...
});

Nota: el parámetro onload para execute es opcional.

Answer 7

puede usar setTimeout () para retrasar la ejecución de algún código