Elementos por name
Una página contiene un un formulario con un grupo de opciones para seleccionar el tipo de menu (verdura, carne, pescado).
El formulario tiene un botón para validar la selección.
Al pulsar el botón se debe mostar una ventana alert con la opción de menu elegida.
Solución
<body>
<form onsubmit="return false">
<input type="radio" name="menu" value="Verdura"> Verduras
<input type="radio" name="menu" value="Pescado"> Pescado
<input type="radio" name="menu" value="Carne"> Carne
<button id ="enviar">Elegir</button>
</form>
<script>
function mostrar(){
let campos = document.getElementsByName("menu");
campos.forEach(function(v){if (v.checked)
alert("Elegiste: "+v.value)})
}
let btn = document.getElementById("enviar")
btn.addEventListener("click", mostrar)
</script>
</body>
Explicación
En este ejemplo se usa el método getElementsName("menu") para seleccionar una colección HTML con los elementos de la página que tienen como atributo name el valor menu
Recuerda que el atributo name si puede repetirse en distintos elementos de la página web, a diferencia del atributo Id
Una colección HTML es un objeto iterable de tipo array (pero no es un array) cuyos items son objetos de la página. En el ejemplo son los elementos input
El script recorre el array con el método forEach() y una función de llamada que lanza la ventana alert() cuando encuentra el elemento seleccionado de la lista.
El script se debe colocar despues del form para que el botón exista y poderle asignar el evento click mediante addEventListener().