Como focar em um elemento de formulário com JavaScript

Neste artigo você vai aprender a como focar em um elemento de formulário com JavaScript, ou seja, ativar o foco em um input

Fala programador(a), beleza? Bora aprender mais sobre forms e JavaScript!

Para focar em um input, ou seja, dar aquele efeito de quando clicamos em um campo de formulário

Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

• 120 aulas
• 4 projetos
• 9h 45min

Conhecer formação

Deixar ele pronto para o usuário digitar, as vezes esta técnica é utilizada para o campo mais importante ou diretamente para o primeiro campo

Para isso vamos precisar selecionar um elemento, podemos utilizar o método querySelector

Utilizamos o método focus neste elemento

Veja um elemento prático:

const input = document.querySelector("#name")

input.focus()

Simples não é?

Basicamente no caso acima o input com id de name foi selecionado

Depois utilizamos a função focus nele, isso faz o input ser selecionado

E assim já podemos digitar nele!

Conclusão

Neste artigo você aprendeu a como focar em um elemento de formulário com JavaScript

Utilizamos o método de seleção querySelector e depois o de foco que é chamado de focus

Assim o input fica pronto para ser utilizado

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias! Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias. O link acima contém um cupom de desconto para os curso