Questão de Programação — Linguagens de marcação — VUNESP 2024

Formulários HTML: elementos select e submit

Gabarito: letra E — os valores de (1) e (2) são, respectivamente, select e submit. O elemento select cria uma lista suspensa (dropdown) para seleção de uma opção, e o submit é o tipo de botão que envia os dados do formulário para o servidor. Essa é a combinação que produz o resultado visual descrito na questão.

O HTML (HyperText Markup Language) é uma linguagem de marcação usada para estruturar o conteúdo de páginas web. Dentro dela, os formulários são a principal forma de interação do usuário com o site, permitindo enviar dados para processamento. Um formulário é delimitado pela tag <form> e contém diversos elementos de entrada, como campos de texto, caixas de seleção, botões de rádio e listas suspensas.

O elemento select é usado para criar uma lista de opções, onde o usuário pode escolher uma ou mais. Cada opção é definida pela tag <option>. Quando o navegador renderiza um select, ele exibe uma caixa que, ao ser clicada, abre uma lista suspensa com as opções definidas. Esse é exatamente o comportamento descrito na imagem 2 da questão: um campo que, ao ser clicado, mostra uma lista de opções.

Já o botão de envio é criado com <input type="submit"> ou <button type="submit">. Esse botão, quando clicado, dispara o envio dos dados do formulário para o endereço definido no atributo action da tag <form>. O texto exibido no botão pode ser personalizado com o atributo value (no caso do input) ou com o conteúdo do button. Na imagem 2, o botão exibido é o de envio, que envia os dados preenchidos.

A pegadinha desta questão está em distinguir o elemento select (que cria a lista suspensa) do elemento option (que define cada item da lista). O select é o contêiner, enquanto o option é o item individual. Além disso, é preciso diferenciar o tipo de botão submit (que envia o formulário) do tipo button (que não envia, apenas executa uma ação definida por JavaScript) e do tipo search (que cria um campo de pesquisa).

Guarde essa distinção: select é o elemento que cria a lista, option é o item da lista, e submit é o botão que envia o formulário. É exatamente nesses pares que as alternativas se dividem.

Alternativa A — ❌ Incorreta

A alternativa afirma que (1) é button e (2) é search. O elemento button cria um botão genérico, que não necessariamente envia o formulário — para isso, precisa do atributo type="submit". Já search é um tipo de campo de entrada (<input type="search">), usado para pesquisas, não para criar uma lista suspensa. Portanto, não corresponde ao que é exibido na imagem 2.

Alternativa B — ❌ Incorreta

A alternativa afirma que (1) é option e (2) é send. O elemento option define cada item individual da lista suspensa, mas não é o elemento que cria a lista em si — esse é o select. Além disso, send não é um valor válido para o atributo type de um botão em HTML; os valores válidos incluem submit, button, reset, entre outros. Portanto, está incorreta.

Alternativa C — ❌ Incorreta

A alternativa afirma que (1) é option e (2) é submit. O erro está no primeiro valor: option é o item da lista, não o contêiner que cria a lista suspensa. O elemento correto para criar a lista é select. O segundo valor, submit, está correto, mas como o primeiro está errado, a alternativa como um todo é incorreta.

Alternativa D — ❌ Incorreta

A alternativa afirma que (1) é select e (2) é send. O primeiro valor está correto: select é o elemento que cria a lista suspensa. No entanto, send não é um tipo válido de botão em HTML. O valor correto para o botão que envia o formulário é submit. Portanto, a alternativa está incorreta.

Alternativa E — ✅ Correta ⟵ GABARITO

A alternativa afirma que (1) é select e (2) é submit. O elemento select cria a lista suspensa, que é exibida na imagem 2 como uma caixa que, ao ser clicada, mostra as opções. O botão submit é o que envia os dados do formulário, e é exibido como um botão clicável. Essa combinação corresponde exatamente ao que é descrito na questão, tornando esta a alternativa correta.

A regra de ouro para questões como esta é identificar o papel de cada elemento: select é o contêiner da lista, option é o item, e submit é o botão de envio. Com isso, você elimina as alternativas que trocam esses papéis.

Gabarito: letra E