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

Как код в файле JavaScript получает URL-адрес файла?

Мне нужно динамически загружать таблицу стилей CSS на страницу, которая находится в другом домене. Как я могу получить полный URL-адрес файла JS для использования в атрибуте href таблицы стилей?

Например, вот структура:

http://bla.com/js/script.js

http://bla.com/css/style.css

Я хочу динамически загружать таблицу стилей на страницу http://boo.net/index.html. Проблема в том, что я не знаю бит bla.com заранее, просто тот факт, что таблица стилей находится в ../css/ относительно JS файла.

script, конечно, включен в index.html. jQuery тоже слишком.

4b9b3361

Ответ 1

Добавьте идентификатор в тег script:

<script type="text/javascript" id="myScript" src="http://bla.com/js/script.js"></script>

И в http://bla.com/js/script.js:

var myScript = document.getElementById('myscript');
var myScriptSrc = myScript.getAttribute('src');
alert(myScriptSrc); // included for debugging

Вы должны иметь возможность манипулировать значением myScriptSrc, чтобы получить путь к любому другому контенту на bla.com.

Я думаю, что этот пример - это Джеймс Блэк, который был в его ответе.

Наконец, всем, предлагающим использовать document.location, имейте в виду, что если вы хотите доступ только для чтения к текущему адресу страницы, вы должны использовать document.URL или window.location. Если вы хотите установить адрес страницы, вы всегда должны использовать window.location.href. Хотя window.location = 'location'; работает, мне всегда надоело видеть, что String присваивается местоположению. Я не уверен, почему, поскольку JavaScript разрешает всевозможные преобразования неявного типа.

  • ссылка mozilla: document.location изначально было доступно только для чтения, хотя браузеры Gecko также позволяют вам назначать. Для безопасности между браузерами используйте window.location. Чтобы получить только URL-адрес в виде строки, можно использовать свойство document.URL только для чтения.
  • Ссылка на ВС: Не используйте location как свойство объекта document; вместо этого используйте свойство document.URL. Свойство document.location, которое является синонимом document.URL, устарело.

Ответ 2

С помощью JQuery вы можете сделать что-то вроде:

$('script[src$="my_script.js"]').attr('src').replace('my_script.js','');
// outputs something like: "/static/js/"

Ответ 3

Еще проще, чем использовать id, просто оставить разметку самостоятельно и использовать document.currentScript. Ссылка на MDN упоминается в разделе Notes, небольшом причуде, который требует, чтобы JavaScript выполнялся синхронно, m, чтобы объяснить, как избежать этой ловушки.

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

Преимущество этого решения заключается в том, что вам не требуется использовать специальную разметку, и это особенно полезно, если вы не можете получить доступ к HTML самостоятельно по какой-либо причине (например, если он используется клиентом или разработчиком с использованием вашего API).

Если script выполняется синхронно (это означает, что основное содержимое script не завернуто в прослушиватель событий или какую-либо другую функцию, установленную для оценки позже, чем когда код "изначально обрабатывается" ), вы может просто использовать document.currentScript для доступа к текущему обрабатывающему элементу <script> вашего кода. Чтобы продемонстрировать, как эффективно использовать это, я дам базовую демонстрацию ниже.

HTML:

<script type="text/javascript" src="http://bla.com/js/script.js"></script>

JavaScript в http://bla.com/js/script.js:

var myScript = document.currentScript,
    mySrc = myScript.getAttribute('src');

console.log(mySrc); // "http://bla.com/js/script.js"

$(function () {
    // your other code here, assuming you use jQuery
    // ...
});

Если вы не хотите, чтобы переменная отображалась в глобальной области, вы также можете сделать это:

(function () {
    var myScript = document.currentScript,
        mySrc = myScript.getAttribute('src');

    console.log(mySrc); // "http://bla.com/js/script.js"

    $(function () {
        // your other code here
        // ...
    });
}()); // self-executing anonymous function

В основном необходимо убедиться и получить доступ к document.currentScript во время синхронного выполнения script, иначе он не будет ссылаться на то, что вы ожидаете от него.

Ответ 4

var JS_SELF_URL = (function() {
    var script_tags = document.getElementsByTagName('script');
    return script_tags[script_tags.length-1].src;
})();

Когда браузер анализирует теги, он также загружает и выполняет их. Поэтому, когда ваш JS файл выполняется, в настоящее время последний тег анализируется.

Ответ 5

Вы можете прочитать document.location, но вы также можете использовать относительные URL

Ответ 6

Вы можете посмотреть тег script для местоположения javascript, и с помощью document.location вы, вероятно, можете определить относительную адресацию, чтобы определить, где может быть файл css.

Ответ 7

Свойство стека объектов ошибок может предоставлять информацию о URL-адресе.

try 
{ 
  throw new Error();
}
catch(exc)
{
  console.log(exc.stack);
}

К сожалению, Webkit не поддерживает (но Chromium) поддержку свойства стека. Существует несколько браузеров, поддерживающих эту функцию: http://173.45.237.168/reference/html/api/Error.html#Error.stack

Вместо стека Webkit предоставляет свойство sourceURL, вот пример использования:

try 
{ 
  throw new Error();
}
catch(exc)
{
  console.log(exc.sourceURL);
}