web-dev-qa-db-fra.com

Quelle est mon URL src de script?

Existe-t-il un moyen simple et fiable de déterminer l'URL du fichier JavaScript en cours d'exécution (au sein d'une page Web)?

Ma seule pensée à ce sujet est d'analyser le DOM pour rechercher tous les attributs de script src afin de déterminer le mode de référence du fichier actuel, puis de déterminer l'URL absolue en l'appliquant à document.location. Quelqu'un a-t-il d'autres idées? Existe-t-il une méthode super facile que j'ai complètement oubliée?

UPDATE: Les éléments de script accessibles via le DOM ont déjà une propriété src qui contient l'URL complète. Je ne sais pas à quel point cela est omniprésent/standard, mais vous pouvez également utiliser getAttribute("src") qui renverra la valeur de l'attribut brut dans le code [X] HTML.

javascriptdomabsolute-pathsrc
32
Neil C. Obremski

Mettez ceci dans le fichier js qui doit savoir que c'est sa propre URL.

Entièrement qualifié (par exemple 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)
}());

Ou tel qu'il apparaît dans le code source (par exemple, /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)
}());

Voir http://www.glennjones.net/Post/809/getAttributehrefbug.htm pour une explication du paramètre getAttribute utilisé (il s'agit d'un bogue IE).

40
Crescent Fresh

Pour les navigateurs récents, vous pouvez utiliser document.currentScript pour obtenir ces informations.

var mySource = document.currentScript.src;

L'avantage, c'est qu'il est plus fiable pour les scripts chargés de manière asynchrone. L'inconvénient est que ce n'est pas, autant que je sache, universellement supporté. Cela devrait fonctionner sur Chrome> = 29, FireFox> = 4, Opera> = 16. Comme beaucoup de choses utiles, cela ne semble pas fonctionner dans IE.

Lorsque j'ai besoin d'un chemin de script, je vérifie si document.currentScript est défini et, si ce n'est pas le cas, j'utilise la méthode décrite dans la réponse acceptée.

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

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

31
kiprainey

Tel qu’il apparaît dans le code source (par exemple, /js/main.js), il s’agit de navigateur multiple :

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
}());

Entièrement qualifié (par exemple http://www.example.com/js/main.js):

Après quelques tests, il semble difficile d’obtenir le pleinement qualifié one de manière multi-navigateur. La solution suggérée par Crescent Fresh ne fonctionne pas dans IE8 pour obtenir le nom complet , même si cela fonctionne dans IE7

6
Marco Demaio

Cette méthode fonctionne avec un chargement différé, asynchrone et différé, puisque vous connaissez le nom de fichier de votre script et s'il est unique.

/* 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 modèle de plug-in jquery contenant: https://github.com/mkdgs/mkdgs-snippet/blob/master/javascript/jquery.plugins.template.js

remarque: cela ne fonctionnera pas avec le script local chargé par jQuery.getScript (), car aucune balise de script n'a été ajoutée dans le dom. le script n'est évalué que dans l'espace global. http://api.jquery.com/jQuery.getScript/

pour le réparer, vous pouvez faire quelque chose comme:

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);
                }
          }
     });
}
4
Mkdgs

S'il s'agit d'une solution strictement client, la vôtre sonne plutôt bien.

Si vous écrivez du code sur le serveur, vous pouvez probablement simplement renseigner l'URL entièrement résolue du script dans un champ div/masqué/(insérez votre élément HTML favori ici), puis le récupérer avec votre javascript du côté client.

0
Jason Watts

Vous pouvez consulter https://addons.mozilla.org/en-US/firefox/addon/10345 si vous souhaitez savoir quelles fonctions (et donc quel fichier) sont exécutées sur un ordinateur. page que vous ne contrôlez pas.

Si vous souhaitez savoir lequel de vos scripts est en cours d'exécution, vous pouvez procéder de différentes manières. Avec Firebug, vous pouvez console.log() les informations. Le simple fait de placer des déclarations d’alerte dans votre code (bien que gênant) peut vous aider à déboguer de manière peu sophistiquée. Vous pouvez également générer des erreurs et les intercepter, puis utiliser les propriétés de l'erreur (voir: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Error ).

Cependant, pourquoi cela serait-il important? Si le script génère déjà des erreurs, il est assez facile de déterminer où l’erreur se produit. S'il ne s'agit pas d'erreurs, alors quel est l'avantage de savoir de quel fichier file provient?

0
Jonathan Fingland