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 Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

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