Tutorial » Como chamar um Javascript externo dentro de um js ou <script>

28 de novembro de 2008 por Leo Caseiro

Eu sempre tentei fazer uma chamada de um arquivo Java Script externo dentro de outro. E sempre tive problemas.

Estava fazendo manutenção em um código, quando me deparei com o código do analytics. E percebi que o Google faz isso a décadas.

Se você, como eu, ainda não sabe(sabia) como fazer isso, veja:

<script type="text/javascript">
document.write(unescape("%3Cscript src='nomedoarquivo.js' type='text/javascript'%3E%3C/script%3E"));
</script>


É simples e funcional. Nunca mais eu farei algo concatenando strings com strings, como:

<script type="text/javascript">
document.write('<SCR'+ 'IPT type="text/javascript" SRC="arquivo.js"><\/SCRIPT>');
</script>

Fui super contente avisar meu colega de trabalho pelo MSN, o Pedro Rogério que me mostrou uma outra forma. É um pouco mais complexa, utiliza o createElement por DOM. E pode funcionar melhor para scripts dinâmicos.

<script type="text/javascript">
function include(file_path){
var j = document.createElement("script"); /* criando um elemento script: <script></script> */
j.type = "text/javascript"; /* informando o type como text/javacript: <script type="text/javascript"></script>*/
j.src = file_path; /* Inserindo um src com o valor do parâmetro file_path: <script type="javascript" src="+file_path+"></script>*/
document.body.appendChild(j); /* Inserindo o seu elemento(no caso o j) como filho(child) do  BODY: <html><body><script type="javascript" src="+file_path+"></script></body></html> */
}

//incluindo um arquivo com a função include()
include("arquivo.js");

function include_once(file_path) {
var sc = document.getElementsByTagName("script");
for (var x in sc)
if (sc[x].src != null &amp;amp;amp;amp;amp;amp;amp;&amp;amp;amp;amp;amp;amp;amp; sc[x].src.indexOf(file_path) != -1) return;
include(file_path);
}
//incluindo um arquivo com a função include_once()
include_once("arquivo.js");
</script>

Posts Relacionados com este assunto


Gostou do Post? Assine o Feed Assine o Feed RSS


Tags: javascript

6 Comentários

  1. Tiago Floriano Disse:

    Show de bola essas funções! Até conhecia uma do El Micox, mas não funcionou em uns jobs. Uma dúvida, para que serve o appendChild?

  2. Leo Caseiro Disse:

    @Tiago, o appendChild serve para informar via DOM que o elemento(nó script) deverá ser criado no filho do nó body(no exemplo).
    Deixei comentado agora o código. Veja se consegue entender.
    Qualquer dúvida, pergunta novamente!
    Abs

  3. Igor Disse:

    aahhaa…
    sempre usei a maneira mais complexa…kkkkk
    essa do google é show de bola…vou testar aqui :D

  4. iarem Disse:

    Valeu

  5. Micael Disse:

    O bom da forma utilizando o DOM é por que além de mais rápido, dificilmente dará problemas em outros browsers.

    Passei a usar o DOM direto devido a problema de criar elementos utilizando o document.write ou o innerHTML, além de velocidade.

    Um abraço

  6. Leo Caseiro Disse:

    Pelo visto, todo mundo utiliza o método dinâmico por DOM!

Deixe um comentário