$ (Document) .já é necessário?

111

Eu vi essa pergunta no stackoverflow, mas não sinto que ela tenha sido respondida.

É $(document).readynecessário?

Eu link todos os meus javascripts na parte inferior da página, então, em teoria, eles estão todos rodando depois que o documento estiver pronto.

Joshua Robison
fonte
3
Navegadores mais antigos podem não gostar do download paralelo que os navegadores mais novos empregam. Esse é o principal motivo pelo qual seus scripts são colocados na parte inferior. Ele permite especificamente que seu HTML e CSS sejam renderizados primeiro em navegadores mais antigos. Neste ponto, você tem uma escolha a fazer sobre como deseja realizar a detecção de que o DOM está carregado. Dois métodos populares para iniciar seu js são window.onload e $ (document) .ready (em conjunto com jQuery). Existem outras opções e desvantagens óbvias para o window.onload. A questão é $ (document). Já funciona com mais freqüência do que não e é fácil de usar.
BradChesney79

Respostas:

125

É $(document).readynecessário?

não

se você colocou todos os seus scripts antes da </body>tag de fechamento, fez exatamente a mesma coisa.

Além disso, se o script não precisa acessar o DOM, não importa onde ele é carregado, além das possíveis dependências de outros scripts.

Para muitos CMSs, você não tem muita escolha de onde os scripts são carregados, portanto, é uma boa forma para o código modular usar o document.readyevento. Você realmente deseja voltar e depurar o código antigo se reutilizá-lo em outro lugar?

fora do assunto:

Como uma observação lateral: você deve usar em jQuery(function($){...});vez de $(document).ready(function(){...});, pois força o alias a $.

zzzzBov
fonte
Tem certeza de que é "exatamente a mesma coisa"? Fiquei com a impressão de que seu css (ou outro código carregado em paralelo com o html principal) ainda não foi totalmente analisado.
Zach Lysobey
6
@ZachL, o documento pode estar pronto antes que o CSS seja totalmente analisado. document.ready não é o mesmo que o onloadevento, onde as imagens e outros ativos externos terminaram de carregar.
zzzzBov 01 de
Obrigado pelo esclarecimento.
Zach Lysobey
5
Este "não" me custou apenas 3 horas de trabalho .. apenas certifique-se de não confundir </body> com <body> :)
teejay
1
Não concordo necessariamente em forçar o alias, especialmente se noConflict()precisar ser usado por algum motivo.
Jay Blanchard
22

Não, se o seu javascript for a última coisa antes de fechar, você não precisará adicionar essas tags.

Como uma observação lateral, uma abreviação para $ (document) .ready é o código abaixo.

$(function() {
// do something on document ready
});

Esta pergunta pode ser boa. Você leu? jQuery: Por que usar document.ready se JS externo na parte inferior da página?

palito de tartaruga
fonte
6
A questão é essencialmente "Eu preciso de um documento pronto quando coloco meus scripts na parte inferior do corpo?", E não "Há um atalho para escrever $(document).ready()".
nnnnnn
4

Não, não é necessário, desde que você saiba que não há nenhuma coisa adiada acontecendo - e na maioria dos casos você saberá se desenvolveu o que está trabalhando de cima para baixo.

- É quando você traz o código de outra pessoa, sem auditar completamente, que você não sabe.

Então, pergunte-se: você está usando um framework ou editor que o ajude com a estrutura? Você está trazendo o código de outra pessoa e não se preocupou em ler cada arquivo? Você está preparado para passar pela matriz de sistema operacional, navegador e versão do navegador para testar seu código? Você precisa extrair cada grama de velocidade de seu código?

document.ready () faz com que muitas dessas questões se tornem irrelevantes. document.ready () foi projetado para tornar sua vida mais fácil. Ele vem com um pequeno impacto de desempenho (e ouso dizer aceitável).

BradChesney79
fonte
Algo que vi - uma das suas edições foi rejeitada, mas parece-me bem. Você pode querer reenviar aquele: stackoverflow.com/review/suggested-edits/3224385
Qantas 94 Heavy
1

Eu vi referências / postagens em blogs na Internet sobre o uso do jquery's document.ready. Na minha opinião, tanto usá-lo quanto colocar todo o seu javascript no final da página são válidos. E agora a questão seria qual seria melhor? É apenas uma questão de estilo de programação.

Krishna Chytanya
fonte
0

Não, não é necessário. Você pode colocar a tag do script logo antes da tag de fechamento do corpo ou, se for compatível com o IE9 +, poderá usar JS nativo.

<script>alert('DOM Loaded!');</script>
</body>

<script>
document.addEventListener("DOMContentLoaded", function(event) { 
      // DOM has loaded ready to fire JS scripts
    });
</script>
mbokil
fonte