Подтвердить что ты не робот

Получить путь script

В CSS любой путь изображения относится к местоположению файла CSS.

f.ex, если я поместил файл CSS в /media/css/mystyles.css и использовал что-то вроде

.background:url(../images/myimage.jpg);

Браузер будет искать изображение в /media/images/myimage.jpg, что имеет смысл.

Можно ли сделать то же самое в javascript?

F.ex, если я включаю /media/js/myscript.js и поставлю туда этот код:

var img = new Image();
img.src = '../images/myimage.jpg';

Th изображение не найдено, поскольку браузер использует HTML файл в качестве отправной точки вместо места script. Я хотел бы иметь возможность использовать местоположение script в качестве отправной точки, как это делает CSS. Возможно ли это?

4b9b3361

Ответ 1

Поиск DOM для вашего собственного тега <script>, как указано выше, является обычным методом, да.

Однако вам обычно не нужно искать слишком сложно: когда вы находитесь в теле script - запустите во время включения - вы очень хорошо знаете, какой элемент <script> вы: последний. Остальные из них еще не были проанализированы.

var scripts= document.getElementsByTagName('script');
var path= scripts[scripts.length-1].src.split('?')[0];      // remove any ?query
var mydir= path.split('/').slice(0, -1).join('/')+'/';  // remove last filename part of path

function doSomething() {
    img.src= mydir+'../images/myimage.jpeg';
}

Это не выполняется, если ваш script связан с <script defer> (или в HTML5, <script async>). Однако в настоящее время это редко используется.

Ответ 2

Как и другие плакаты, вам нужно сначала вычислить ваш базовый url для script, вы можете найти script ниже.

// find the base path of a script
var settings = {};
settings.basePath = null;

if (!settings.basePath) {
  (function (name) {
    var scripts = document.getElementsByTagName('script');

    for (var i = scripts.length - 1; i >= 0; --i) {
      var src = scripts[i].src;
      var l = src.length;
      var length = name.length;
      if (src.substr(l - length) == name) {
        // set a global propery here
        settings.basePath = src.substr(0, l - length);

      }
    }
  })('myfile.js');
}

log(settings.basePath);

Ответ 3

Вдохновленный bobince ответом выше, я написал версию jQuery. Вот код в одной строке:

var scriptpath = $("script[src]").last().attr("src").split('?')[0].split('/').slice(0, -1).join('/')+'/';

Изменить: Отфильтровать тег script с помощью атрибута src, чтобы мы работали с src.

Ответ 4

В более поздних браузерах вы можете использовать свойство document.currentScript для получения элемента HTMLScript, соответствующего этому script, затем запросите его свойство src.

Могу ли я использовать, означает поддержку 70% пользователей веб-сайтов на момент написания этой статьи. Очевидно, Internet Explorer не поддерживает его, но Edge делает. MDC поддерживает поддержку как Chrome 29+, Edge, Firefox 4.0+, Gecko 2.0+, Opera 16+ и Safari 8+. Комментарий от @mjhm уже указывал на эту функцию, но тогда это звучало очень экспериментально.

Ответ 5

Для асинхронных скриптов тэг script не будет выполняться. Так что если: - performance.timing существует (как в новых браузерах без Safari) & Амп; Вы не достигли максимума или не дошли до загрузки до загрузки & Амп; Ваш script был последним загруженным:

performance.getEntries().slice(-1)[0].name 

Чтобы отжать максимум, сделайте что-то вроде этого:

performance.webkitSetResourceTimingBufferSize(10000)

Ответ 6

(Если base [Rubens answer] не работает для вас. Edit: Очевидно, он удалил его, но я подумал, что это актуально, см. base на сайте W3C.)

Это возможно, но это боль.:-) Вам нужно найти DOM для тега script, который импортировал ваш script, а затем захватить его значение src. То, что script.aculo.us делает свою модульную автозагрузку; вы можете обратиться к scriptaculous.js для примера.

Ответ 7

Я написал класс, чтобы найти путь к сценариям, который работает с задержкой загрузки и тегами async script. Он основан на проверке трассировки стека, и есть несколько функций для форматирования результатов, но они должны быть базовыми. Если ничего другого не использовать в качестве ссылки.

function ScriptPath() {
  var scriptPath = '';
  try {
    //Throw an error to generate a stack trace
    throw new Error();
  }
  catch(e) {
    //Split the stack trace into each line
    var stackLines = e.stack.split('\n');
    var callerIndex = 0;
    //Now walk though each line until we find a path reference
    for(var i in stackLines){
      if(!stackLines[i].match(/http[s]?:\/\//)) continue;
      //We skipped all the lines with out an http so we now have a script reference
      //This one is the class constructor, the next is the getScriptPath() call
      //The one after that is the user code requesting the path info (so offset by 2)
      callerIndex = Number(i) + 2;
      break;
    }
    //Now parse the string for each section we want to return
    pathParts = stackLines[callerIndex].match(/((http[s]?:\/\/.+\/)([^\/]+\.js)):/);
  }

  this.fullPath = function() {
    return pathParts[1];
  };

  this.path = function() {
    return pathParts[2];
  };

  this.file = function() {
    return pathParts[3];
  };

  this.fileNoExt = function() {
    var parts = this.file().split('.');
    parts.length = parts.length != 1 ? parts.length - 1 : 1;
    return parts.join('.');
  };
}

Полный источник

Ответ 8

Вы можете перевернуть <head> childNodes, найти тэг <script>, получить URL-адрес указанного script и вычислить URL-адрес вашего изображения.

Ответ 9

Один из способов - поместить путь в сам script:

var scriptPath = <?PHP echo json_encode(dirname($_SERVER['SCRIPT_NAME'])); ?>;

Ответ 10

ЗАМЕЧАНИЕ, что все образцы этого вопроса принимают LAST-тег, и, как указано, не поддерживают асинхронную загрузку. поэтому, если вы хотите сделать это совершенным образом, вы должны соответствовать ВАШЕ script name ДОПОЛНИТЕЛЬНО. на самом деле это позволяет сделать это.

просто проблема, которую выделяет "неполный" код, и такие проекты, как http://areaaperta.com/nicescroll/, используют эту версию кода

Ответ 11

В моем случае это не scripts.length-1.
Пример:
В режиме отладки js расположение файла: //server/js/app.js
В режиме prod js расположение файла: //server/js-build/app.js
Имя файла известно; единственный способ найти путь по его имени:

getExecutionLocationFolder() {
    var fileName = "app.js";
    var scriptList = $("script[src]");
    var jsFileObject = $.grep(scriptList, function(el) {
        var currentElement = el.src.contains(fileName);
        return currentElement;
    });
    var jsFilePath = jsFileObject[0].src;
    var jsFileDirectory = jsFilePath.substring(0, jsFilePath.lastIndexOf("/") + 1);
    return jsFileDirectory;
};

Ответ 12

вы можете получить путь script путем анализа тегов документа и сравнить его с расположением документа.

// get relative document path to script folder
var pathToScript=function(scriptFileName){
    // scan document to get script location
    var sclist = document.getElementsByTagName("script");
    var found = null;
    for(var i=0;i<sclist.length&&!found;i++){
        // check if tag have source (avoid local scripts tags)
        if(typeof(sclist[i].src)=="string"){
            // remove arguments and extract file basename
            var file = sclist[i].src.split("?")[0].split("/").pop();
            // get path if found
            if(file==scriptFileName)found = sclist[i].src.split("?")[0];
        }
    }
    // compare with document location
    if(found){
        var _from = document.location.href.split("/");
        var _to__ = found.split("/");
        // remove files names
        _from.pop();_to__.pop();
        // remove common pathes
        while(_from.length>0&&_to__.length>0&&_from[0]==_to__[0]){
            _from.shift();_to__.shift();
        }
        // add parent dir offset if any
        while(_from.length>0){
            _to__.unshift("..");_from.pop();
        }
        // return relative document path to script folder
        return _to__.length>0?(_to__.join("/")+"/"):"";
    }else{
        throw("\npathToScript Error :\nscript source '"+scriptFileName+"' not found in document.");
    }
};

// use in script file "myscript.js" :
var pathToMe = pathToScript("myscript.js");
console.log("my dir : "+pathToMe);