<script>: O Elemento SCRIPT
Última atualização: 2026-10-13
<script>O Elemento SCRIPT
Incorpora ou referencia JavaScript para interatividade; coloque em head ou body, frequentemente no fim do body para renderização mais rápida.
| Categoria | Scripts e Incorporação |
|---|---|
| Modelo de Conteúdo | Conteúdo de fluxo |
| Pais Permitidos | Qualquer elemento que aceite conteúdo de fluxo |
| Tag de Fechamento | Sim — requer fechamento </script> tag |
| Status | Padrão |
📝 Sintaxe
<script src="app.js"></script>
⚙️ Atributos
Este elemento suporta os atributos globais mais os seguintes:
| Atributo | Valor | Descrição |
|---|---|---|
src | URL of an external script (inline code ignored when src is set). | |
type | Script type, default text/javascript (module for ES modules). | |
async | Executes as soon as downloaded, without blocking parsing. | |
defer | Runs after parsing, before DOMContentLoaded. | |
crossorigin | CORS setting for cross-origin scripts. |
▶ Exemplo
Edite o código abaixo e veja o resultado em tempo real no playground:
🌐 Suporte de Navegadores
| Navegador | |||||
|---|---|---|---|---|---|
| <script> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Suportado em todos os navegadores principais | |||||
Dica: Use src para arquivos externos; código inline vai entre as tags; async/defer se aplicam apenas a scripts externos.
❓ Perguntas Frequentes
QQual é a diferença entre async e defer de script?
AAmbos carregam scripts externos sem bloquear:
async executa assim que o download termina, sem ordem garantida (para scripts independentes, como analytics); defer executa em ordem, após a análise do DOM (para scripts principais que dependem do DOM). Sem nenhum dos dois, o download bloqueia a análise do HTML — em projetos modernos, todo script externo leva pelo menos um dos dois.Qscript vai no head ou no fim do body?
ACom
defer, o head resolve (baixa antes, sem bloquear a renderização); scripts inline ou sem defer que dependem do DOM vão no fim do body. Prática moderna padrão: head + defer — scripts do tipo module já têm comportamento defer por natureza.QO que há de especial em type='module'?
AAtiva o ES Module: suporte a import/export, modo estrito automático, execução deferida por padrão e escopo independente (sem poluir o global). Scripts tradicionais sem module rodam no escopo global e de forma síncrona. Em projetos novos, padronize com module.
🏷️ Tags Relacionadas
💡 Casos Relacionados
Mais estudos de caso em breve — volte mais tarde.