标签：
大一下学期学院开了JS，由于不喜欢老师的style，开课两个月可以说几乎没听。但JS还是得学，从YouTube上找了一个playlist自学中。下面写一下我学了些什么。
JS的变量，函数，基本控制类型（if，switch，各种loop）都和C++很像就不废话了。有了C++的功底我觉得学JS基本就是学它和别的语言不一样的东西，目前看来基本就是两样：1.语法 2.者么和html交互（比如form，id，checkbox，radio之类）；
从最近我保存html文件开始进入细节吧：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"/> 5 <title>my00</title> 6 <script type="text/javascript"> 7 function check(){ 8 var un=document.getElementById(‘id_1‘).value; 9 var pw=document.getElementById(‘id_2‘).value; 10 var yB=document.getElementById(‘id_3‘).checked; 11 var nB=document.getElementById(‘id_4‘).checked; 12 var cB=document.getElementById(‘id_5‘).checked; 13 var cF=document.getElementById(‘id_6‘).checked; 14 var cTT=document.getElementById(‘id_7‘).checked; 15 var cT=document.getElementById(‘id_8‘).checked; 16 if((un=="")||(pw=="")||(yB==false && nB==false)||(cB==false && cF==false && cTT==false && cT==false)){ 17 alert("Fill In All The Fields Please!"); 18 return false; 19 } 20 else{ 21 return true; 22 } 23 } 24 </script> 25 </head> 26 <body> 27 <form action="http://www.baidu.com" method="get" onsubmit="return check()"> 28 User Name:<input type="text" value="" id="id_1"/><br> 29 Password:<input type="password" value="" id="id_2"/><br> 30 <p>Do you want to keep it secret?</p> 31 <input type="radio" name="checkB" value="Yes" id="id_3"/>Yes<br> 32 <input type="radio" name="checkB" value="No" id="id_4"/>No<br> 33 <p>What Kinds Of Sports Do You Like?</p> 34 <input type="checkbox" name="myCheckbox" value="Basketball" id="id_5">Basketball<br> 35 <input type="checkbox" name="myCheckbox" value="Football" id="id_6">Football<br> 36 <input type="checkbox" name="myCheckbox" value="Table Tennis" id="id_7">Table Tennis<br> 37 <input type="checkbox" name="myCheckbox" value="Tennis" id="id_8">Tennis<br> 38 <input type="submit" value="Login"/><br> 39 </form> 40 </body> 41 </html>
从body看这份html文件主要就是表单（form），JS做的事情就是确保用户填了所有信息（更具体的说是确保用户填了user name，password，确保选择了一个radio也既单选框，确保至少选择了一个checkbox也即复选框）。JS实现所谓“确保”的方式是if语句，你看<script></script>之间的if语句肯定会感觉很乱，我写完这行代码也这么觉得，不过我当初写的时候并不这么觉得。基本上这个if语句就是在 1.user name为空2.password为空3.两个radiobutton都没被选择4.没有一个checkbox被勾选；这四种情况下return false，else就return true；
而return的值是属于check（）这个函数的，什么时候调用check（）函数呢？不难发现是form标签的onsubmit事件。好吧，又回到html上来了。在这份文件中body里是个form标签，form里是四类input标签，他们的type分别是 1.text ；2.radio； 3.checkbox； 4.submit；其中的text不多说就是让用户输入一些文本，radio是单选框，看一下31行和32行，这两行的name属性都是“checkB”，这表明这两个单选框是一组，用户只能从中选择一个。checkbox和radio很像，唯一的不同是checkbox可以被用户多选。最后的submit是一个按钮，代表提交表格，当用户按下这个按钮时form标签的“onsubmit“就被触发，开始return JS的check（）函数的返回值。一旦check（）函数发现用户按要求填了表单，check（）函数的返回值就为真，进而执行form标签的action（这里我让网页跳转到百度，但现实世界中不带这么玩的）。最后啰嗦一下这里form标签的”method“属性，一般method可以选”get“和”post“这两种值，post更安全一点。如果你感到头大，忽略它，目前记住可以填”get“和”post“就OK；
这是网页在chrome中加载的截图，还有一点是在JS的check（）函数中有几个变量，un代表user name，ps代表password，这里用了.value属性，其他变量都用了.checked属性。比如说user name这一栏，如果用户没填，那么value就是空，在check（）函数的if中就满足了 un==”“ 会return false，这样一来form表单的action不会执行。
标签：
原文地址：http://www.cnblogs.com/liberty1900/p/4464139.html
