Как загрузить один файл JavaScript из другого?

Как вы загружаете один файл JavaScript из другого файла JavaScript, например CSS? В CSS мы используем write @import url("mycss.css");.

Есть ли способ сделать это в JavaScript?

ОТВЕТЫ

Ответ 1

Да. Если вы хотите использовать чистый JavaScript, вам необходимо динамически создать тег script и добавить его в документ.

Да. Если вы используете библиотеку jQuery, вы можете использовать метод $.getScript.

$.getScript("another_script.js");

Ответ 2

В Javascript нет функции import/ish/method, но вы можете просто добавить тег script в тег <head>, например:

newScript = document.createElement('script');
newScript.type = 'text/javascript';
newScript.src = '/path/to/js/file';
document.getElementsByTagName('head')[0].appendChild(newScript);

Или, как Эдгар, упомянутый прямо передо мной, вы можете использовать jQuery.

Ответ 3

Просто потому, что никто еще не упомянул об этом, есть еще один вариант, который не требует каких-либо причудливых библиотек или сложного кодирования, document.write. В принципе, это будет выглядеть так, хотя см. Ниже для оговорки:

document.write('<script src="myscript.js" type="text/javascript"></script>');

Это будет выполнено после полного разбора тега script, и если вы поместите свой тег script в голову, новый тег script также будет находиться в начале, сразу после того, как он будет выполнен. Постарайтесь выполнить его непосредственно, а не когда документ был загружен (как в обратном вызове $(function(){}). Это то, что я использую:

(function(){
  function load(script) {
    document.write('<'+'script src="'+script+'" type="text/javascript"><' + '/script>');
  }

  load("script1.js");
  load("script2.js");
  load("etc.js");
})();

Закрывающая функция просто не загрязняет глобальное пространство имен.

Предостережение (и почему "script", который разбит выше) состоит в том, что в теге script не может быть конечных тегов script, анализатор HTML не знает его части script. Там другой вопрос по этому вопросу.

Ответ 4

Javascript сам по себе не предоставляет никакой помощи в модуляции, кроме возможности eval строки. Но это достаточно распространенная потребность в том, что большинство крупных фреймворков javascript разработали свои собственные решения, а в последнее время предпринимались усилия по стандартизации этих API в requirejs. Если вы используете фреймворк вроде Dojo или jQuery, вы, вероятно, просто лучше учитесь использовать свои возможности, но если нет, requirejs - это легкий автономный инструмент. Вы просто добавляете

<script data-main="scripts/main" src="scripts/require.js"></script>

в ваш раздел <head>, а затем разместите свой собственный javascript внутри некоторого кода оболочки (украденного с сайта require.js):

require(["helper/util"], function() {
    //This function is called when scripts/helper/util.js is loaded.

    require.ready(function() {
        //This function is called when the page is loaded
        //(the DOMContentLoaded event) and when all required
        //scripts are loaded.

    });
});

Ответ 5

Вы можете включить оба файла JS в файл HTML, как показано ниже:

<script type="text/javascript" src="JS/file_1.js"></script>
<script type="text/javascript" src="JS/file_2.js"></script>

Теперь вы можете использовать все объекты и функции, определенные в файле_1.js в файле_2.js.