Как разместить ссылки на другие файлы JavaScript в Javascript?

Question

У меня есть куча ссылок на JavaScript в нижней части одного из моих HTML-шаблонов. Я хочу создать отдельный файл JavaScript, который будет содержать только все исходные ссылки.

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

Что я действительно спрашиваю, так это то, как я могу получить такой же эффект, как CSS @import функциональность для JavaScript.

И если это невозможно, могу ли я поместить блок HTML в нижний колонтитул моего шаблона из другого HTML-файла?

Answer 1

Вы могли бы сделать это с помощью AJAX, но простой способ это просто добавить их с JQuery

$('.div').append('<script src="myscript.js"></script>'); 

надежду, что помогает

Answer 2

Вы можете создать отдельный файл JS и object в нем. Этот объект может иметь несколько ключей, и их значение будет связано с этими ссылками. Возвращение этого объекта из файла

Надежда этого фрагмент будет полезным

linkFile.js

var AllLinks = function(){ 
var _links ={}; 
_links.keyOne ="link1"; 
_links.keyTwo ="link2"; 
return { 
links:_links 
} 
} 

Также включите этот файл, используя script тега В другом файле вы можете получить это значение как

AllLinks.links.keyOne & и так далее

Answer 3

Имейте массив, который содержит ссылку на ваши файлы сценариев, а затем у вас есть два варианта либо использовать $.getScript() для загрузки каждого из них, либо путем создания HTML-кода из него и добавления его в свой тег head или body. Я предпочитаю тег head, чтобы сохранить все скрипты и файлы css.

Ваш массив сценария файлы

var JsFiles = ["script1.js","script2.js","script3.js","script4.js"]; 

Первый подход с использованием$.getScript()

JsFiles.each(function(i,v){ 
    $.getScript(JsFiles[i], function(data, textStatus, jqxhr){ 
    console.log(textStatus); // Success 
    }); 
}); 

Недостаток описанного выше подхода заключается в том, что getScript делает асинхронной вызовы к файлам скриптов это означает, что если script2.js зависит от script1.js (например, если script1.js - это некоторый файл плагина, который использует инициализацию в script2.js). Тогда вы столкнетесь с проблемами.

Преодолеть вы, возможно, придется затем использовать Promises или написать функцию обратного вызова на каждой функции успеха getScript, которая вызовет следующий сценарий нагрузки и так далее ..

Если порядок загрузки сценария не имеет значения, то выше подход хорошо идти.

Второй подход построения HTML

var scriptTags =""; 
JsFiles.each(function(i,v){ 
    scriptTags += "<script src='"+ JsFiles[i] +"'></script>"; 
}); 
$('head').append(scriptTags); 

Хорошая вещь об этом подходе является то, что файлы сценариев теперь будет загружать синхронно, и вы не столкнетесь с проблемой зависимости. Но убедитесь, что независимые файлы начинаются с первого, и, наконец, появляются зависимые файлы.