2009-06-12 15 views
31

¿Existe una manera simple y confiable de determinar la URL del archivo JavaScript que se está ejecutando actualmente (dentro de una página web)?¿Cuál es mi script src URL?

Mi único pensamiento en esto es escanear el DOM para todos los atributos de script src para encontrar cómo se hizo referencia al archivo actual y luego descubrir la URL absoluta aplicándola al document.location. Alguien tiene otras ideas, ¿hay algún método super fácil que pase por alto por completo?

ACTUALIZACIÓN: Los elementos de script accedidos a través del DOM ya tienen una propiedad src que contiene la URL completa. No sé qué tan omnipresente/estándar es, pero alternativamente puede usar getAttribute("src"), que devolverá el valor del atributo sin formato en el [X] HTML.

+0

posible duplicado de [¿Cómo puede obtener el nombre de archivo de secuencia de comandos desde dentro de ese guión?] (Http://stackoverflow.com/questions/710957/how-might-i-get-the -script-filename-from-within-that-script) – Bergi

Respuesta

40

Pon esto en el archivo js que necesita saber su propia URL.

Fully Qualified (por ejemplo http://www.example.com/js/main.js):

var scriptSource = (function(scripts) { 
    var scripts = document.getElementsByTagName('script'), 
     script = scripts[scripts.length - 1]; 

    if (script.getAttribute.length !== undefined) { 
     return script.src 
    } 

    return script.getAttribute('src', -1) 
}()); 

O Tal y como aparece en la fuente de (por ejemplo /js/main.js):

var scriptSource = (function() { 
    var scripts = document.getElementsByTagName('script'), 
     script = scripts[scripts.length - 1]; 

    if (script.getAttribute.length !== undefined) { 
     return script.getAttribute('src') 
    } 

    return script.getAttribute('src', 2) 
}()); 

Ver http://www.glennjones.net/Post/809/getAttributehrefbug.htm para la explicación del parámetro getAttribute siendo usado (es un error de IE).

+0

Volteando ¡EXCELENTE! ¡Gracias! –

+1

Para el totalmente calificado no se puede simplemente usar script.src? ¿Por qué estás usando script.getAttribute ('src', -1) ??? –

+9

Gran respuesta. Una advertencia: si el script está cargado de forma diferida (inyectado en el DOM por otro script), no será el último script en el DOM, por lo que este fragmento exacto no funcionará. – ripper234

0

Si se trata de una solución estrictamente cliente, la suya suena bastante bien.

Si está escribiendo código en el servidor, probablemente podría completar un campo div/oculto/(inserte aquí su elemento favorito de HTML) con la URL totalmente resuelta del script, y retírelo con su javascript en el lado del cliente.

+0

del lado del servidor, podría simplemente servir a js a través de asp/php/jsp/cgi y dar salida a la url en javascript desde allí. – ZJR

+0

@ ZJR - Actualmente estoy disfrutando la idea de un "canal JS", sin embargo se sirve;) – simon

0

Es posible que desee echar un vistazo a https://addons.mozilla.org/en-US/firefox/addon/10345 si le interesa saber qué funciones (y por lo tanto qué archivo) se están ejecutando en una página que no controla.

Si está interesado en averiguar cuál de se está ejecutando su scripts, entonces hay varias maneras. Con Firebug puedes console.log() la información. Incluso poner declaraciones de alerta en su código (aunque sea molesto) puede ayudar a depurar de una manera poco tecnológica. También podría generar errores y capturarlos, luego procesar utilizando las propiedades del error (consulte: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Error)

Sin embargo, ¿por qué sería esto importante? Si el script ya está causando errores, entonces es bastante fácil determinar dónde se está produciendo el error. Si no se trata de errores, ¿cuál es la ventaja de saber qué archivo proviene?

+0

En mi proyecto actual, los archivos de recursos de JavaScript se fijan a un subdirectorio específico. Averiguar cuál es la URL absoluta del script me puede decir cuál es el directorio base local para poder quitarlo y obtener la "clave" del documento (como se conoce en el lado del servidor). Se usará para generar formularios, solicitudes de sincronización, etc. y no para la depuración. –

+0

en ese caso, lo que propuso anteriormente es la única solución realmente disponible. –

6

Tal y como aparece en la fuente de (por ejemplo /js/main.js), esto es cross-browser:

var scriptSource = (function() 
{ 
    var scripts = document.getElementsByTagName('script'), 
     script = scripts[scripts.length - 1]; 

    //No need to perform the same test we do for the Fully Qualified 
    return script.getAttribute('src', 2); //this works in all browser even in FF/Chrome/Safari 
}()); 

Fully Qualified (por ejemplohttp://www.example.com/js/main.js):

Después de algunas pruebas, parece difícil obtener totalmente calificado uno de forma cruzada. El solution suggested by Crescent Freshno funciona en IE8 para obtener el completo, aunque funciona en IE7

4

Este método de trabajo con Defer, asíncrono y de carga diferida Dado que se conoce el nombre del archivo de secuencia de comandos, y si será única plantilla de complemento

/* see 
* http://stackoverflow.com/questions/984510/what-is-my-script-src-url/984656#984656 
* http://www.glennjones.net/Post/809/getAttributehrefbug.htm 
* 
* iterate all script to find script with right filename 
* this work with async and defer (but your script MUST have a unique filemane) 
* mozilla support document.currentScript and we use it, if is set 
* 
* this will not work with local script loaded by jQuery.getScript(), 
* since there is no script tag added into the dom. the script is only evaluated in global space. 
* http://api.jquery.com/jQuery.getScript/ 
* 
* to fix this odd, you can add a reference in meta (meta[name=srcipt][content=url]) 
* when you load the script 
*/ 
var scriptFilename = 'jquery.plugins.template.js'; // don't forget to set the filename 
var scriptUrl = (function() { 
    if (document.currentScript) { // support defer & async (mozilla only) 
     return document.currentScript.src; 
    } else { 
     var ls,s; 
     var getSrc = function (ls, attr) { 
      var i, l = ls.length, nf, s; 
      for (i = 0; i < l; i++) { 
       s = null; 
       if (ls[i].getAttribute.length !== undefined) { 
        s = ls[i].getAttribute(attr, 2);      
       }    
       if (!s) continue; // tag with no src 
       nf = s; 
       nf = nf.split('?')[0].split('/').pop(); // get script filename 
       if (nf === scriptFilename) { 
        return s; 
       } 
      } 
     };   
     ls = document.getElementsByTagName('script'); 
     s = getSrc(ls, 'src'); 
     if (!s) { // search reference of script loaded by jQuery.getScript() in meta[name=srcipt][content=url] 
      ls = document.getElementsByTagName('meta');    
      s = getSrc(ls, 'content'); 
     }   
     if (s) return s; 
    } 
    return ''; 
})(); 

var scriptPath = scriptUrl.substring(0, scriptUrl.lastIndexOf('/'))+"/"; 

un jQuery con él: https://github.com/mkdgs/mkdgs-snippet/blob/master/javascript/jquery.plugins.template.js

nota: esto no funcionará con la escritura local cargada por jQuery.getScript(), ya que no hay etiqueta de script añadido en el DOM. el script solo se evalúa en el espacio global. http://api.jquery.com/jQuery.getScript/

para solucionarlo se puede hacer algo como:

function loadScript(url,callback) {  

    if ($('[src="'+url+'"]').length) return true; // is already loaded  

    // make a reference of the loaded script 
    if ($('meta[content="'+url+'"]', $("head")).length) return true; // is already loaded 
    var meta = document.createElement('meta'); 
    meta.content = url; 
    meta.name = 'script'; 
    $("head").append(meta); 

    return $.ajax({ 
      cache: true, 
      url: u, 
      dataType: 'script', 
      async: false, 
      success : function (script) {      
       try { 
        if (typeof callback == 'function') callback();  
       } catch (error) { 
        //console.log(error); 
       } 
      } 
    }); 
} 
+0

Interesante uso de 'document.currentScript' aquí. Lamentablemente, la información de soporte del navegador no está disponible en http://caniuse.com. Puede ayudar subiendo el número abierto: http://github.com/Fyrd/caniuse/issues/1099. – Stephan

+0

Lo he votado pero caniuse.com no es la única fuente de información. https://developer.mozilla.org/en-US/docs/Web/API/Document/currentScript – Mkdgs

29

Para los navegadores recientes, puede utilizar document.currentScript para obtener esta información.

var mySource = document.currentScript.src; 

Lo bueno es que es más confiable para los scripts que se cargan de forma asíncrona. La desventaja es que, como yo sé, no es universalmente compatible. Debería funcionar en Chrome> = 29, FireFox> = 4, Opera> = 16. Como muchas cosas útiles, parece que no funciona en IE.

Cuando necesito obtener una ruta de script, compruebo si document.currentScript está definido y, si no, uso el método descrito en la respuesta aceptada.

if (document.currentScript) { 
    mySource = document.currentScript.src; 
} else { 
    // code omitted for brevity 
} 

https://developer.mozilla.org/en-US/docs/Web/API/document.currentScript

+0

http://caniuse.com aún no controla esta función. Puede ayudar con un voto positivo aquí: http://github.com/Fyrd/caniuse/issues/1099. – Stephan

Cuestiones relacionadas