Entretanto, Javascript não tem essa funcionalidade por padrão, o que complica essa versatilidade. Então pesquisei e descobri uma forma de implementar essa funcionalidade. Vamos para o código:
function include(file_path, feedback){
var j = document.createElement("script");
j.type = "text/javascript";
j.async = true;
j.onload = feedback;
j.src = file_path;
document.head.appendChild(j);
}
Então, baseando no mesmo nome utilizado no PHP: a função include! Essa função começa criando um elemento chamado script, e então dizemos que o tipo dele é javascript. Então, configuramos ele para que ele seja assíncrono e configuramos o evento onload para que seja executado assim que o arquivo for carregado. Prosseguindo, damos o caminho do arquivo que queremos incluir. Por fim, adicionamos ele na <head> do html. Lembrando que document.head é um comando disponível a partir do HTML5.
Isso resolve o nosso problema, mas isso não impede de por exemplo, outras bibliotecas que utilizam algumas bibliotecas comum, acabam criando vários scripts redundantes. Para isso, vamos implementar o include_once do PHP, que verifica se o arquivo já foi incluído:
function include_once(file_path,feedback) {
var sc = document.getElementsByTagName("script");
for (var x in sc){
if (sc[x].src != null &&
sc[x].src.indexOf(file_path) != -1){
return;
}
}
include(file_path,feedback);
}
Basicamente o código pega todos os elementos "script" e verifica se cada um deles é o arquivo que queremos incluir. Se for, então encerra a busca e retorna vazio. Se não houver, incluimos o script no código. Simples assim.
Ah! Lembrando uma coisa, os caminhos são sempre em relação ao arquivo que está o html e não o arquivo js. Por exemplo, temos os arquivos nos seguinte diretórios:
- ./index.html
- ./script/principal.js
- ./script/secundario.js
Releembrando que o carregamento é assíncrona, por isso você deve esperar o arquivo estar carregado para poder executar algum código que está nele. Caso contrário, você receberá várias mensagens avisando que a função tal está indisponível.
Nenhum comentário:
Postar um comentário