在Javascript中不使用getElementById获取元素

Question

考虑HTML中的两个单选按钮

 <input type="radio" id="genderMale" name="gender" onclick="greetGender(   )">Male</input>
 <input type="radio" id="genderFemale" name="gender" onclick="greetGender( )">Female</input>

在js中评估

function greetGender(){

if(genderMale.checked === true){

alert("Hello Sir");

}
else{

alert("Hello Madam");
}

}

即使

也能完美执行

document.getElementById('genderMale').checked

替换为

 genderMale.checked

有人请解释这个行为为什么Id被直接访问，这是否可能我错过了什么

jsfiddle here

http://jsfiddle.net/ganesh_vellanki/gcLqL57c/

感谢时间