A principal maneira de inserir o código JavaScript na página HTML é através da tag de script. Isso inclui duas formas. O primeiro é inserir diretamente o código JS entre as tags de script, e o segundo é introduzir arquivos JS externos através do atributo SRC. Como os bloqueios de intérprete a renderização do restante da página durante a análise e a execução do código JS, isso causará inchaço a longo prazo e atrasos nas páginas com uma grande quantidade de código JS. Para evitar esse problema, é recomendável colocar todas as referências de JS antes da tag </body>.
Existem dois atributos de tags de script, adiamento e assíncrono; portanto, o uso de tags de script é dividido em três situações:
1. <Script src = "Explet.js"> </script>
Sem o atributo difer ou assíncrono, o navegador carregará imediatamente e executará o script correspondente. Ou seja, antes de renderizar o documento após a tag de script, você não espera pelo carregamento subsequente dos elementos do documento e comece a carregar e executar depois de lê -lo. Isso bloqueará o carregamento do documento subsequente;
2. <script assync src = "Exemplo.js"> </script>
Com o atributo assíncrono, significa que o carregamento e a renderização dos documentos subsequentes são realizados em paralelo com a carga e execução de scripts JS, ou seja, execução assíncrona;
3. <Script adiar src = "Exemplo.js"> </script>
Com o atributo de adiamento, o processo de carregamento de documentos subsequentes e o carregamento do script JS (apenas carregando, mas não executando neste momento) são realizados em paralelo (assíncrono). A execução do script JS precisa esperar até que todos os elementos do documento sejam analisados e antes da execução do evento DomContentLoaded Yitdings.
A figura a seguir pode ver intuitivamente a diferença entre os três:
Entre eles, o azul representa o tempo de carregamento da rede de scripts JS, o vermelho representa o tempo de execução do script JS e o verde representa a resolução do HTML.
A partir da figura, podemos esclarecer os seguintes pontos:
1. Adiar e assíncrono são consistentes no processo de carregamento de rede e são executados de forma assíncrona;
2. A diferença entre os dois é quando o script é executado após o carregamento. Pode -se observar que o adiamento está mais alinhado com os requisitos da maioria dos cenários para carregamento e execução do script de aplicativos;
3. Se houver vários scripts com atributos de adiamento, eles executam o script na ordem de carga; Para assíncronos, seu carregamento e execução estão intimamente ligados. Independentemente da ordem da declaração, ela será executada imediatamente enquanto a carga for concluída. É de pouca utilidade para scripts de aplicação porque não considera dependências.
resumo:
O ponto comum entre adiar e assíncrono é que eles podem carregar arquivos JS em paralelo e não bloqueará o carregamento da página. A diferença é que, depois que o adiamento é carregado, o JS aguardará a carga inteira da página antes da execução. O Async executará o JS imediatamente após o carregamento. Portanto, se houver uma ordem estrita de execução de JS, é recomendável usar o adiamento para carregar.
O exposto acima é uma explicação detalhada da diferença entre atributos de adiamento e assíncrono no JS apresentado a você pelo editor. Espero que seja útil para você. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a você a tempo. Muito obrigado pelo seu apoio ao site wulin.com!