10

Estava enfrentando problemas com o carregamento de JS, principalmente pelo IE8, e me surgiu essa dúvida. Pesquisei bastante, acabei melhorando algumas coisas.

Atualmente, eu carrego todos os arquivos JS no final da página, antes da tag body.

<body>
    ...
    ...
    <script type="text/javascript" src="jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="jquery.validate.min.js"></script>
    <script type="text/javascript" src="funcoes.js"></script>
</body>

No caso o funcoes.js é onde eu chamo (ou gostaria de chamar) todas as funções do site. E é aí que acontecem os problemas. Tenho nele por exemplo:

$(document).ready(function(){
    validar();
});

$(window).scroll(function () {
    ...
});

$("#form_contato").validate();

$('.bxslider').bxSlider();

function validar(){
    ...
}

Eu não sei se possui alguma ordem na chamada dessas funções... Não sei, por exemplo, quando tenho que utilizar $(function(){...});.

Tenho sempre que ficar testando, e às vezes acontece de no IE8 alguma função não funcionar, daí começa a novela de mudar de lugar (as vezes chamando logo abaixo dos scripts no body entre as tags script resolve), daí essa função funciona, mas outra pára de funcionar, e daí lá vou eu começar a fazer testes de novo...

O que posso estar fazendo de errado?

3
  • 1
    Talvez essa pergunta ajude. Não fala especificamente do ie8
    – rray
    Commented 10/04/2014 às 19:17
  • Sempre colocar precedência no carregamento do js, seguindo os itens mais acima que são exigidos logo após ... Pelas 3 referencias de js do seu exemplo não ta errado fazer assim, mas, possa ser que você ta chamando item que ainda não foi declarado. Exemplo: tem ai no seu código bxSlider, cade a referencia do mesmo ??? Só lembrando que isso independe de navegador, se faltar o js, vai acontecer erros ...
    – user6026
    Commented 10/04/2014 às 19:43
  • 1
    Esta pergunta também deve ajudar: pt.stackoverflow.com/questions/8416/…
    – bfavaretto
    Commented 10/04/2014 às 21:39

3 Respostas 3

8

Você precisa usar um framework que gerencia os requests de arquivos para você e faz isso apenas sob demanda, por exemplo, o arquivo com o método validar() vai ser carregado apenas se o método for chamado de fato, assim sempre fazendo request dos arquivos na ordem correta.

Pesquise sobre RequireJS: http://requirejs.org/

4

Os navegadores quando carregam uma página executam ela de cima pra baixo da direita para a esquerda. Quando o navegador passar por um arquivo javascript ele executa imediatamente o codigo deste mas no entanto se as funções do Javascript estiverem fazendo uso do HTML antes do navegador chegar e escreve-lo dá erro.

Para nossa felicidade o navegador dispara dois eventos:

Primeiro - Nos indica quando uma pagina carregou todo o HTML (DOM Ready)

Segundo - Nos indica quando uma pagina carregou todas as imagens. (Window Load)

Quando você usa funções que lidam com o HTML, o ideal é chamá-las somente quando todo o HTML ja estiver carregado DOM Ready

No caso do JQuery você deveria começar sempre a execução do seu Javascript no:

$(document).ready(function(){ 
     Funcao1();
     Funcao2();
     Funcao3();
     //... etc
});

function Funcao1() {}
function Funcao2() {}
function Funcao3() {}
-5

Carregue as bibliotecas entre <head> e </head>. O conteúdo do head é carregado antes do body.

1
  • 2
    Nem sempre, muitos códigos javascript precisam que o DOM esteja pronto para serem executados, nesses casos é preferível carregar logo antes de </body> Commented 11/04/2014 às 13:46

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .