JS_01_入门学习
01:编写js文件:JavaScript_01.js
// JavaScript Document //1、利用JavaScript来输出文字 <script type="text/javascript"> <!-- document.write("02:External text output text!"); //--> </script>
02:编写html代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Tentative JavaScript</title> </head> <body> 1、Use JavaScript to output text ! <script type="text/javascript"> <!-- document.write("out put text"); //--> </script> <br /> 2、Import external js to use ! <script src="JavaScript_01.js"></script> <br /> 3‘if / else / alert <script type="text/javascript"> var hob="football"; var hob02="js"; if(hob02=="js"){ alert("Good for you !"); }else if(hob=="football"){ alert("Bad for you !"); } </script> <br /> 4、Use js in form ! <script type="text/javascript"> </script> <form> <p><input type="radio" name="input" onclick="hobs(this.value)" value="js" id="js"/><label for="js">JavaScript</label></p> <p><input type="radio" nam="input" onclick="hobs(this.value)" value="football" id="js"/><label>Football</label></p> </form> 5、Use js switcth() method in html ! Use parseInt transform other to int ! <script type="text/javascript"> var score=65; switch(parseInt(score/10)){ case 0: case 1: case 2: case 3: case 4: case 5: alert("bad digree"); break; case 6: case 7: alert("just so so !"); break; case 8: case 9: alert("good for you"); break; } </script> <br /> 6、Get value by id <script type="test/javascript"> function judge(){ var score_01; var degree_01; score_01=document.getElementsById("score_01").value; if(score_01>100){ degree_01="do not need me !"; }else{ degree_01="good for you"; } } document.write(degree_01); </script> <form action="#" method="post"> <label for="score_01"> Degree[0-100] </label> <input name="score_01" id="score_01" type="text"/> <button onclick="judge()">ClickToSubmit</button> </form> <br /> 7、Prompt <script type="text/javascript"> var score_07; var degree_07; score_07=prompt("Input your degree !"); if(score_07>100){ degree_07="Are you kiding"; }else{ switch(parseInt(score_07/10)){ case 0: case 1: case 2: case 3: case 4: case 5: case 6: degree_07="bad degree"; judge_07(); break; case 7: degree_07="7 degree"; judge_07(); case 8: case 9: degree_07="8-9 degree"; judge_07(); } } function judge_07(){ document.write("<br/>"+degree_07); alert(degree_07); } </script> <br /> 8、confirm <script type="text/javascript"> function isCainiao(){ var isC=confirm("are you cainiao?"); if(isC==true){ alert("CaiNiao"); }else{ alert("DaShen"); } } isCainiao(); </script> <form action="#" method="post"> <button value="confirm" onclick="isCainiao()">Submit</button> </form> 9、for in loop / Array <br /> <script type="text/javascript"> var x; var hobbies_09=new Array(); hobbies_09[0]="java"; hobbies_09[1]="script"; hobbies_09[2]="javascript"; for(x in hobbies_09){ document.write(hobbies_09[x]+"<br/>"); } </script> 10、incident <br /> <script type="text/javascript"> function incident_09(){ document.write("mouseOn"); } </script> <button onmouseout="incident_09()">incidentOn</button> <br /> 11、try catch finally <script type="text/javascript"> var i_11=0; var j_11=0; try{ i/i; }catch(e){ alert("error"); }finally{ alert("finally"); } </script> <br /> </body> </html>