Como Obter O Valor Selecionado Pelo Radio Button Javascript

Enquanto estamos desenvolvendo um formulário no HTML, as vezes nos deparamos em cenários onde precisamos pegar o valor selecionado pelo usuário.
Isso envolve campos de texto, select box, radio buttons, checkbox!
Hoje, vou mostrar como podemos pegar o valor selecionado pelo usuário em um radio button, com Javascript puro!

Vamos considerar que o nosso HTML tem a seguinte estrutura:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<div class="form-group">
<label class="d-block font-weight-bold">Já é cliente?</label>
<div class="form-check form-check-inline">
<input
class="form-check-input"
type="radio"
value="true"
name="client">
</div>
<div class="form-check form-check-inline">
<input
class="form-check-input"
type="radio"
value="false"
name="client">
<label class="form-check-label">Não</label>
</div>
</div>

Legal, agora queremos saber qual é o valor selecionado pelo usuário.
Para isso, vamos verificar com Javascript!

1
document.querySelector('input[name="client"]:checked').value;

Com esse Javascript, nós acessamos apenas o radio button que estiver selecionado e que seu name seja client, que é o que definimos no nosso HTML!
Bem simples né?