Agrego scripts dinámicamente a mi página usando el siguiente código:
var newScriptElem = document.createElement("script"); newScriptElem.innerHTML = myJSCodeString; // myJSCodeString loaded before from .js separate file. parentElement.appendChild(newScriptElem); El código interno se llama y funciona bien en su mayoría, pero no puedo obtener ninguna variable fuera de ese bloque. Tengo un objeto singleton cargado antes agregado manualmente usando la etiqueta <script src="app.js"> . Tiene variable global, que quiero leer.
Funciona bien si agrego el código en la etiqueta del script dentro del archivo HTML, pero no funciona si trato de obtenerlo desde un script cargado dinámicamente.
Así es como se ve app.js, básicamente:
var app = new App(); function App(){ this.someVar = 2; }Este si funciona
<body> <script src="js/app.js"></script> <script> console.log(app); // Outputs App Obj </script> </body>Pero esto no:
var newScriptElem = document.createElement("script"); newScriptElem.innerHTML = "console.log(app)"; // Outputs "undefined" parentElement.appendChild(newScriptElem);¿Hay alguna forma de leer variables globales desde el alcance de un elemento de secuencia de comandos agregado dinámicamente?
PD: intento usar Cordova, por cierto, pero no funciona en el navegador Chrome de todos modos.
En su pregunta, no está agregando el script que ha generado.
<script> var foo = 1; var newScriptElem = document.createElement("script"); newScriptElem.innerHTML = `console.log(${foo});`; document.body.append(newScriptElem); console.log("loaded"); </script>Una solución, como mencionó @Bergi, es llamar a eval(myJSCodeString) , en lugar de agregarlo como un bloque <script> .
De esa forma, el código se ejecutará tal cual y las variables globales estarán accesibles.