Javascript 取得 radio button 內容的做法

前陣子好奇怎麼從 HTML 表單裡截取 radio button 選擇的內容。以下提供簡單的程式碼。

HTML 的部份

<form name="userInputForm">
<h1> Please enter your option among rock, paper or scissors </h1>
<input name="userInput" type="radio" value="rock"> Rock<br>
<input name="userInput" type="radio" value="paper"> Paper<br>
<input name="userInput" type="radio" value="scissors"> Scissors
<input type="Submit" onclick="getUserInput()">
</form>

Javascript 的部份

function getUserInput() {
var userInput = document.querySelector('input[name="userInput"]:checked').value;
document.write("Your result: " + userInput + "</br>");
document.write(typeof userInput + "</br>");
return userInput;