Este artigo demonstra a finalidade, a funcionalidade e o uso da propriedade “checked” do HTML DOM Input Radio em JavaScript.
O que é a propriedade “checked” do rádio de entrada HTML DOM em JavaScript?
A propriedade “marcada” do rádio de entrada funciona nos formulários HTML e campos de entrada para definir e verificar o status do botão “Rádio”.
Sintaxe (definir propriedade verificada)
radioObject. verificado = verdadeiro | falsoDe acordo com a sintaxe de retorno definida, a propriedade “checked” suporta dois parâmetros listados abaixo:
- verdadeiro: Representa que o elemento correspondente está marcado.
- falso: Indica que o elemento correspondente está desmarcado.
Sintaxe (Retornar Propriedade Verificada)
radioObject. verificado Na sintaxe acima, o “ objeto de rádio ” refere-se ao HTML “
Vamos usar as sintaxes definidas acima para explicar o uso da propriedade “checked” do rádio de entrada HTML DOM com a ajuda de exemplos práticos fornecidos.
Exemplo 1: Aplicando a propriedade “checked” do rádio de entrada Usando a sintaxe básica
No primeiro exemplo, o botão “Radio” é criado para definir sua propriedade “checked” usando a sintaxe generalizada definida.
Código HTML
Em primeiro lugar, observe o código HTML indicado:
< estilo de corpo = 'alinhar texto: centro' >
< h2 > HTML Propriedade verificada do rádio de entrada DOM h2 >
Cor : < tipo de entrada = 'rádio' eu ia = 'amarelo' > Amarelo < br >< br >
< botão ao clicar = 'colorCheck ()' > Verificar 'amarelo' botão >
< botão ao clicar = 'colorUncheck ()' > Desmarcar 'amarelo' botão >
Nas linhas de código acima:
- O '
” marca define a seção do corpo que está alinhada com o “ Centro ”. - O ' ” especifica o primeiro subtítulo.
- O '
” adiciona um botão “Rádio” especificando o tipo de entrada “ rádio ” com um ID atribuído “ amarelo ”. - O '
” adiciona um botão simples associado a um “ ao clicar ” para executar o “ ColorCheck() ” que será acessada ao clicar no botão. - Da mesma forma, outro “
” cria um botão para invocar a tag “ colorUncheck() ” ao clicar no botão.
Código JavaScript
Em seguida, siga o código JavaScript fornecido:
< roteiro >função colorCheck ( ) {
documento. getElementById ( 'amarelo' ) . verificado = verdadeiro ;
}
cor da função Desmarcar ( ) {
documento. getElementById ( 'amarelo' ) . verificado = falso ;
}
roteiro >
No trecho de código acima:
- A primeira função “ ColorCheck() ” utiliza o “ document.getElementById() ” para buscar o botão de opção, associe o método “ verificado ” e defina seu valor como “true”.
- Por outro lado, a função “ colorUncheck() ” define o valor do “ verificado ” como “false” no botão Radio acessado.
Saída
Como visto, a saída verifica o botão “Radio” ao clicar no botão (denominado “Check”) e desmarca” ao clicar no botão (“Uncheck”).
Exemplo 2: Retornando o Valor “checked” do Rádio de Entrada
Este exemplo aplica a propriedade “checked” do Input Radio para retornar o estado do botão “Radio” de destino como um valor booleano.
Código HTML
Considere o seguinte código HTML:
< estilo de corpo = 'alinhar texto: centro' >< h2 > HTML Propriedade verificada do rádio de entrada DOM h2 >
Cor : < tipo de entrada = 'rádio' verificado = verdadeiro eu ia = 'amarelo' > Amarelo < br >< br >
< botão ao clicar = 'colorCheck ()' > Verificar 'amarelo' botão >
< p id = 'amostra' >< p >
No bloco de código acima, o “ Rádio ” é criado e o status do botão “ verificado ” propriedade é definida como “ verdadeiro ”. Depois disso, da mesma forma, a função declarada é invocada por meio do anexo “ ao clicar ” com o botão.
Código JavaScript
Agora, considere as seguintes linhas de código:
< roteiro >função colorCheck ( ) {
onde = documento. getElementById ( 'amarelo' ) . defaultChecked ;
documento. getElementById ( 'amostra' ) . HTML interno = t ;
}
roteiro >
No trecho de código acima:
- Defina uma função chamada “ ColorCheck() ”.
- Em sua definição, aplique o “ document.getElementById() ” para acessar o botão “Rádio” usando seu id “amarelo” e associar o “ defaultChecked ” para verificar o valor padrão da propriedade “ verificado ” atributo.
- Por último, aplique o “ document.getElementById() ” novamente para buscar o parágrafo vazio incluído e exibir o status da propriedade “checked”.
.
Saída
Conforme analisado, o resultado retorna o status do botão “Rádio” fornecido, ou seja, “ verdadeiro ” após o clique do botão.
Conclusão
Em JavaScript, a propriedade HTML DOM Input Radio “checked” é útil para definir e retornar o status verificado do botão “Radio”. A sintaxe definida da propriedade “checked” funciona em dois valores “ verdadeiro ' e ' falso ”. Por outro lado, sua sintaxe de retorno não requer nenhum parâmetro. Este artigo demonstrou o objetivo, a funcionalidade e o uso da propriedade “checked” do HTML DOM Input Radio em JavaScript.