Duplicar posible:
Including a .js file within a .js file¿Cómo incluir el archivo js en otro archivo js?
¿Cómo puedo incluir un archivo JS en otro archivo js, de manera que se adhieren a la DRY principle y evitar la duplicación de código.
Sólo puede incluir un archivo de secuencia de comandos en una página HTML, no en otro archivo de script. Dicho esto, puede escribir JavaScript que carga el script "incluido" en la misma página:
var imported = document.createElement('script');
imported.src = '/path/to/imported/script';
document.head.appendChild(imported);
Hay una buena probabilidad de que su código depende de su "incluido" guión, sin embargo, en cuyo caso se puede fallar porque el navegador cargará el script "importado" de forma asíncrona. Su mejor opción será simplemente usar una biblioteca de terceros como jQuery o YUI, que resuelve este problema por usted.
// jQuery
$.getScript('/path/to/imported/script.js', function()
{
// script is now loaded and executed.
// put your dependent JS here.
});
Solo puedo repetir: en el caso del uso '$ .getScript' el segundo script dependiente comenzará a cargar ** después de que el primero se cargue y ejecute **. Es ** secuencial en lugar de carga paralela **. Además, si alguien incluye por '
No es posible directamente. También puede escribir algún preprocesador que pueda manejar eso.
Si lo entiendo correctamente, entonces a continuación son las cosas que pueden ser útiles para lograr que:
Usar un pre-procesador que se desarrollará a través de sus archivos JS, por ejemplo, la búsqueda de patrones como "@import somefile.js "y reemplazarlos con el contenido del archivo real. Nicholas Zakas (Yahoo) escribió un tal biblioteca en Java que se puede utilizar (http://www.nczonline.net/blog/2009/09/22/introducing-combiner-a-javascriptcss-concatenation-tool/)
Si está usando Ruby on Rails entonces usted puede dar activo Jammit envasado de un intento, que utiliza el archivo de configuración donde se puede assets.yml defina sus paquetes que pueden contener múltiples archivos y luego refiéralos en su página web real por el nombre del paquete.
trate de usar un cargador de módulos como RequireJS o un cargador de script como LabJs con la capacidad de controlar la secuencia de carga, así como tomar ventaja de la descarga en paralelo.
JavaScript actualmente no proporciona una forma "nativa" de incluir un archivo JavaScript en otro como CSS (@ importación), pero todas las herramientas antes mencionadas/maneras puede ser útil para lograr el principio DRY usted ha mencionado. Puedo entender que puede no ser intuitivo si eres de un fondo del lado del servidor, pero así son las cosas. Para los desarrolladores front-end, este problema suele ser un "problema de implementación y empaquetado".
Espero que ayude.
¿podría dar un ejemplo? –
Edité mi respuesta para explicar mejor lo que tengo en mente. Espero que esta vez sea lo suficientemente claro. – Arnab
tiene que escribir por lo
document.write('<scr'+'ipt type="text/javascript" src="other js file.js" ></scr'+'ipt>');
en su primer archivo js
Ugh, por favor no ** abogar ** usando 'document.write()'. –
@Matt Ball: tienes razón, pero como Vahan es nuevo aquí, tal vez quieras explicar por qué. – Konerak
@Konerak: [aquí está el porqué] (http://stackoverflow.com/questions/802854/why-is-document-write-considered-a-bad-practice). –
no estoy de acuerdo con el crítico de document.write técnica (ver suggestion of Vahan Margaryan). Me gusta el camino document.getElementsByTagName('head')[0].appendChild(...) (vea suggestion of Matt Ball), pero hay un problema importante: el orden de ejecución de los scripts incluidos en el camino. Debo describir el problema más exactamente debajo.
Recientemente he pasado mucho tiempo para reproducir one close problem. El bien conocido plugin jQuery usa la misma técnica (ver src here) para cargar los archivos, pero diferentes personas han reportado problemas al trabajar con esto. Puedo describir el problema como sigue. Permítanos tener una biblioteca de JavaScript que consta de muchos scripts y un loader.js carga todas las partes. Algunos de las partes dependen de otro. Permítanos incluir otra secuencia de comandos main.js por <script> que usa los objetos de loader.js inmediatamente después del loader.js. El problema fue que en algún momento, el main.js se ejecuta antes de que todos los scripts cargados por loader.js. El uso de $(document).ready(function() {/*code here*/}); dentro de la secuencia de comandos main.js tampoco podría ayudar. El uso del controlador de eventos en cascada onload en el loader.js seguirá a la secuencia secuencial en lugar de la carga paralela de los scripts y dificultará el uso de la secuencia de comandos main.js que debería incluirse en algún lugar después de loader.js.
Podría reproducir el problema en mi entorno y puede ver que el orden de ejecución de las secuencias de comandos en Internet Explorer 8 puede ser otro orden de inclusión de JavaScripts. Es un problema muy difícil si necesita incluir algunos scripts donde uno depende de otro. El problema y se describe en Loading Javascript files in parallel. Como se sugirió la solución a utilizar document.writeln:
document.writeln("<script type='text/javascript' src='Script1.js'></script>");
document.writeln("<script type='text/javascript' src='Script2.js'></script>");
Se describe que en el caso "los guiones se descargan en paralelo, pero ejecutados en el orden en que están escritas en la página". Después de cambiar de la técnica document.getElementsByTagName('head')[0].appendChild(...) al document.writeln, nunca había visto ningún problema más.
Así que le recomiendo que use document.writeln.
ACTUALIZADO: Si alguien tiene un interés que puede tratar de la carga (y volver a cargar) the page en Internet Explorer (la página de uso document.getElementsByTagName('head')[0].appendChild(...) técnica) y compararla con the fixed version utiliza document.writeln. (El código de la página está relativamente sucio y no es mío, pero se puede usar para reproducir el problema que describo).
posible duplicado de [Incluyendo un archivo .js dentro de un archivo .js] (http://stackoverflow.com/questions/2145914/including-a-js-file-within-a-js-file) o [este uno] (http://stackoverflow.com/questions/950087/include-javascript-file-inside-javascript-file) – user113716