Como obter o valor da caixa de seleção em JavaScript

No JavaScript, obter um valor de caixa de seleção traz facilidade para o usuário ao confirmar as opções selecionadas. Além disso, no caso de enviar um formulário importante, obter um valor de caixa de seleção auxilia na inserção de informações precisas. Além disso, selecionar várias opções para uma resposta em um questionário ou um questionário e obter o valor da caixa de seleção ajuda a encontrar a solução correta.

Este artigo o guiará para obter/buscar valores de caixa de seleção em JavaScript.

Como obter/buscar/buscar o valor da caixa de seleção em javascript?

Para obter o valor da caixa de seleção em JavaScript, você pode usar:

• • ““documento.QuerySelectorAll ()”Método
  • ““documento.getElementById”Método

Vamos agora passar por cada um dos métodos um por um!

Método 1: Obtenha o valor da caixa de seleção em JavaScript usando o documento.método querySelectorAll ()

O "documento.QuerySelectorAll ()”O método retorna todos os elementos que correspondem a um seletor CSS. Você também pode utilizar este método para selecionar os valores da caixa de seleção especificados.

Sintaxe

documento.QuerySelectorAll (seletores CSS)

Aqui, "Seletores CSS”Consulte o nome das caixas de seleção definido no arquivo html.

Passe pelo exemplo a seguir para demonstração:

Exemplo

Na primeira etapa, atribuiremos um “etiqueta para”Atributo que especifica um rótulo para um elemento html de entrada de um formulário. Depois disso, adicionaremos o tipo de entrada “Caixa de seleção”Para usar a caixa de seleção como entrada. Agora, vamos atribuir “nome","valor", e "eu ia”Para cada caixa de seleção. Por fim, também incluiremos um botão para obter o valor da caixa de seleção. Esses processos serão repetidos para cada uma das três caixas de seleção:

Selecione seu idioma favorito

Pitão
Java
JavaScript

Obtenha o assunto selecionado

Na próxima etapa, buscaremos o botão “eu ia" usando "documento.QuerySelector ()”Método e adicione o“clique”Evento para o botão. Em seguida, inclua o “documento.QuerySelectorAll ()”Método no evento de clique para selecionar os valores das caixas de seleção especificadas. Finalmente, aplique o “empurrar()”Método para exibir o valor de cada caixa de seleção selecionada usando o“documento.escrever()”Método:

A saída da implementação acima resultará em:

Método 2: Obtenha o valor da caixa de seleção em JavaScript usando o documento.getElementById () método

O "documento.getElementById ()”O método retorna um elemento com um valor ou id especificado. Também pode ser usado para buscar a caixa de seleção “eu ia”E retorne o valor de cada caixa de seleção selecionada.

Sintaxe

documento.getElementById (ElementId)

Aqui o "ElementId” refere -se ao valor de identificação de um elemento cujo valor selecionado será buscado.

Vamos passar pelo exemplo seguinte para demonstração.

Exemplo

Em primeiro lugar, especificaremos o tipo de entrada para “Caixa de seleção"E atribuir o"eu ia","aula", e "valor”Para cada caixa de seleção, conforme discutido no método anterior. Vamos conter essas funcionalidades em uma tag chamada de tabela dados “”. Da mesma forma, incluiremos um botão com um “ONCLICK”Evento que acessará a função“getCheckBoxValue ()”:

Selecione seu idioma favorito

Pitão:
Java:
JavaScript:
Enviar

Agora, declararemos uma função chamada “getCheckBoxValue ()”Para buscar o ID de cada caixa de seleção usando o“documento.getElementById ()”Método. Em seguida, criaremos uma variável “resultado”, No qual o valor resultante da caixa de seleção selecionado será armazenado.

Por fim, adicionaremos condições diferentes para cada caixa de seleção usando “se/else" declarações. Essas declarações funcionarão de tal maneira que, se uma caixa de seleção específica for selecionada ou marcada como verificada, o documento.GetElementById () Método acessará seu ID, e o valor correspondente contra esse ID específico será exibido. Por fim, exiba o conteúdo do valor da caixa de seleção da loja:

A saída da implementação acima resultará em:

Fornecemos todos os métodos mais simples para obter valores de caixa de seleção em JavaScript.

Conclusão

Para obter o valor da caixa de seleção em JavaScript, você pode usar o “documento.QuerySelectorAll ()”Método para selecionar as caixas de seleção especificadas ou o“documento.getElementById”Método para obter o“eu ia”Contra cada uma das caixas de seleção selecionadas e exibir seu valor correspondente. Este artigo explicou os métodos para obter valores de caixa de seleção em JavaScript.