2011-06-03 27 views
9

Estoy haciendo uso de constructores (clases) ampliamente y me gustaría que cada constructor esté en un archivo separado (algo así como Java). Supongamos que los constructores dicen que Class1, Class2, ... Class10 y yo solo queremos usar Class1 y Class5. Necesito usar etiquetas de script para incluir Class1.js y Class2.js en la página HTML. Más tarde, si también necesito usar Class3 y Class6, de nuevo tengo que ir a la página HTML y agregar etiquetas de script para ellos. El mantenimiento con este enfoque es muy pobre.¿Cómo dividir el código JavaScript en varios archivos y usarlos sin incluirlos a través de la etiqueta script en HTML?

¿Hay algo en JavaScript similar para incluir la directiva de C? Si no, ¿hay alguna manera de emular este comportamiento?

+1

"sin incluirlas a través de la escritura de la etiqueta en HTML" - No es posible – Shaz

+2

([ 'XMLHttpRequest'] (https://developer.mozilla.org/en/XMLHttpRequest)?) @Shaz Quiero decir que solo incluyo un archivo, digamos main.js, y carga todos los requeridos. – Cracker

Respuesta

1

se puede usar algo como esto:

jsimport = function(url) { 
    var _head = document.getElementsByTagName("head")[0];   
    var _script = document.createElement('script'); 
    _script.type = 'text/javascript'; 
    _script.src = url; 
    _head.appendChild(_script); 
} 

luego utilizarlo en su código como:

jsimport("example.class.js"); 

Tenga cuidado al utilizar esta opción cuando el head ya está en el DOM, de lo contrario ganó no funciona

0

puede incluir un archivo JS en otro archivo js haciendo algo como esto en el begginig de su archivo JS:

document.write("<script type='text/javascript' src='another.js'></script>"); 
1

Sí: Se puede crear script etiquetas de JavaScript y las clases requeridas de carga en la demanda.

ver aquí para un par de soluciones: http://ntt.cc/2008/02/10/4-ways-to-dynamically-load-external-javascriptwith-source.html

Con el uso cuidadoso de id atributos o una variable global que contiene "ya cargado" guiones, debería ser posible desarrollar un marco de resolución de dependencias para el JavaScript como Maven o OSGi para Java.

0

El mejor enfoque en su situación, está usando un compilador de algún tipo. El más grande es Google Closure Compiler. Esto forma parte de Google Closure Libraty, que tiene una estructura similar a la que describió.

1

Cuando hablamos de JavaScript, creo que es mejor incluir un archivo que incluya todo lo que necesita en lugar de solicitar un nuevo archivo cada vez que necesite algo a lo que no tenga acceso actualmente.

Cada vez que envíe otro archivo, el navegador hará muchas cosas. Comprueba si el archivo solicitado se puede encontrar de hecho enviando una HTTPRequest, y si el navegador ya lo ha visto, ¿está en caché y sin cambios?

Lo que quieres hacer no está en el espíritu de JavaScript. Hacer lo que está explicando producirá tiempos de carga adicionales, y no podrá hacer nada hasta que el archivo se haya cargado completamente, lo que crea tiempos de espera.

Sería mejor utilizar un archivo para esto, incluir en el extremo interno de la etiqueta </body (que no causará que el navegador espere hasta que la secuencia de comandos termine de cargar la página), luego cree una función simple que se ejecutará cuando la página esté completamente cargada.

Por ejemplo:

<html> 
    <head></head> 
    <body> 
      <!-- HTML code here... --> 
      <script src="javascript.js"></script> 
      <script> 
       (function r(f) { 
        /in/.test(document.readyState) ? setTimeout('r(' + f + ')', 9) : f() 
       })(function() { 
         // When the page has completey loaded 
         alert("DOM has loaded and is ready!"); 
       }); 
      </script> 
    </body> 
</html> 
+0

Utilizaré este sistema en el entorno de desarrollo. Al poner el material en producción, combinaré todos los archivos en un solo archivo. – Cracker

Cuestiones relacionadas