javascriptday1

来源：互联网发布：打淘宝客服电话要钱吗编辑：程序博客网时间：2024/06/05 05:41

JavaScript 网页脚本语言;从C语言的基础上演变出来的
//1.JavaScript定义变量;
//2.JavaScript定义方法(函数);
JavaScript中定义变量统一使用var来定义.没有具体的数据类型;
JavaScript也有变量的作用域;跟Java的判定方式一样;

Java中定义方法的格式:
修饰符返回类型方法名(参数列表)异常处理 {方法体}
JavaScript定义方法的格式
function 方法名(参数列表) {方法体}

————————————————————————————————————————————————————————————

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>javascript test1</title><!-- Javascript 可以写在任何一个Html文档中的位置:Head中可以,Body中可以,Html之后也可以; --> <script type="text/javascript"> //javascript 中的注释方式跟Java类似; /* javascript中只有块注释,没有Java中的文档注释 */var test;//javascript中的类型,只有在变量赋值之后才知道到底是什么类型;test = 123;//整数类型window.alert(test);test = "Tomcat";//字符串类型window.alert(test);test = new Array(5);//数组类型;也就是Java中的引用数据类型;对象;window.alert(test);//ext ==> 专门用来美化HTML界面的UI组件;这里面的所有内容全部都是Javascript//Ajax 技术  ===> 老技术新用法 ==> 使用到javascript </script></head><body></body></html>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><script type="text/javascript">//注意,如果要在变量定义之前进行调用或者打印是不可以的.// 因为这时候变量还没有初始化,所以调用是会出现错误;// 定义变量或者方法的时候一定要避免重复命名的问题;// 因为javascript中没有方法的重载,更没有方法的覆盖;// 错误的调用 : window.alert(test1);</script><script type="text/javascript">//测试javascript变量的作用域var test1 = "test1";//编写javascript的方法function testVarArea(){var test2 = "test2";window.alert(test1);window.alert(test2);}//window.alert(test1);//window.alert(test2);//testVarArea();//在调用javascript的方法(函数)//java:for (声明变量并且初始化;判断表达式;变量修改){ 循环体 }//javaScript:for(声明变量并且初始化;判断表达式;变量修改){ 循环体 }function testfor(){for(i=0;i<10;i++){window.document.write("i==>"+i+"<br>");}}//testfor();//javascript => while 循环;function testwhile(){//java:while(判断表达式){ 循环体;变量修改}i = 0;while(i<10){window.document.write("while==>i : "+i+"<br>");i++;//自增}}//testwhile();function testdowhile(){i=0;do{window.document.write("do while i==>"+i+"<br>");i++;}while(i<10);}//testdowhile();function testifelse(){i=10;if(i<10){window.alert("i<10");}else if(i>10){window.alert("i>10");}else{window.alert("i=10");}}//testifelse();function testswitch(){i=1;switch(i){case 1:{window.alert("i=1");break;}case 2:{window.alert("i=2");break;}case 3:{window.alert("i=3");break;}default :{window.alert("找不到对应的选项");}}}testswitch();</script></head><body></body></html>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><script type="text/javascript">function testArray(){//测试javascript中的数组;//javascript中的数组和Java中的数组有区别;//声明1:使用new的方式声明一个Array数组;var array = new Array(5);//可以通过具体的下标值进行数据的赋值// 具体每个数据是什么类型需要根据赋值的结果来判定// 那么这样的话,javascript的数组就有点类似于Java中的一个有限长度的// 集合一样.array[0]="tom";array[1]=20;array[2]="male";array[3]=4500.00;array[4]="广州天河华南师范大学";//window.alert(array);return array;}function iteratorArray(){var arrays = testArray();for(i=0;i<arrays.length;i++){window.document.write("arrays["+i+"] ==> "+arrays[i]+"<br>");}}//iteratorArray();function testDate(){//测试Date()时间;var times = new Date();//获取本机系统的当前时间;window.document.write(times.toLocaleString());} //testDate();/*for (变量 in 对象){    在此执行代码}*/function testforin(){var a = testArray();for( i in a){window.document.write(a[i]+"<br>");}}//testforin();function testMath(){//Math对象,直接调用.不需要创建;window.document.write(Math.PI);}testMath();</script></head><body></body></html>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><script type="text/javascript">//测试带有参数的JavaScript的functionfunction testParam(r){area = Math.PI*r*r;len = Math.PI*r*2;window.document.write("圆的半径为:"+r+"<br>");window.document.write("经过计算的圆面积为:"+area+"<br>");window.document.write("经过计算的圆周长为:"+len);}//testParam(4.5);var arrays = [1,2,3,4,5,6,7,8,9];function testArrays(){for(i=0;i<arrays.length;i++){window.document.write(arrays[i]+"<br>");}}//testArrays();//window.document.write(arrays);//怎样创建javascript中的Map集合;var map = {name:"Tom",sex:"male",age:25,email:"tom@163.com"};//window.document.write(map);function testMap(){//专门遍历map集合;window.document.write(map.name+"<br>");window.document.write(map.sex+"<br>");window.document.write(map.age+"<br>");window.document.write(map.email+"<br>");}//testMap();function testNumber(){window.document.write(Number.MAX_VALUE+"<br>");window.document.write(Number.MIN_VALUE+"<br>");window.document.write(Number.NEGATIVE_INFINITY+"<br>");window.document.write(Number.POSITIVE_INFINITY+"<br>");window.document.write(isNaN("65")+"<br>");window.document.write(isNaN("6w5")+"<br>");}//testNumber();//转换字符串类型的数据为数字类型;//typeof 运算符返回一个用来表示表达式的数据类型的字符串。 function testParsInt(str){//打印具体的类型;window.document.write(typeof(str)+"<br>");//是不是数字类型;if(!isNaN(str)){i = parseInt(str);window.document.write(typeof(i));}}//testParsInt("12345");function testString(str){var s = new String(str);// 打印字符串中的第一个位置的字符 charAt(int index) 返回索引//window.document.write(s.charAt(0));// 将传入的字符串在次于当前的这个字符串进行连接;// 组合成一个新的字符串赋值给变量s;//s = s.concat(s);//window.document.write(s);//测试字符的下标值;//i = s.indexOf("r");//window.document.write(i);//arry = s.split(":");//window.document.write(arry);// 获取字符串从下标12开始取,向后取12个字符; //window.document.write(s.substr(12,12)+"<br>");// substring(起始位置,结束位置);//window.document.write(s.substring(12, 24));// javascript中判定是否相等没有equals 只有 == //利用循环的方式来逐个查找;/*for(i=0;i<s.length;i++){if(s.charAt(i)=="@"){window.document.write(s.charAt(i));}}*///i = s.indexOf("@");//window.document.write(s.substr(i,1));//window.document.write(s.substring(i,i+1));//s = s.replace("m","&");//window.document.write(s);//字符串转换大小写window.document.write(s.toLowerCase()+"<br>");window.document.write(s.toUpperCase()+"<br>");window.document.write(s.toLocaleLowerCase()+"<br>");window.document.write(s.toLocaleUpperCase()+"<br>");window.document.write(s.toLocaleString()+"<br>");}//testString("Marry:female:23:marry@163.com");</script></head><body></body></html>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title></head><body><table border="1" ><tr><td>1</td><td>2</td><td>3</td></tr><tr><td>4</td><td>5</td><td>6</td></tr><tr><td>7</td><td>8</td><td>9</td></tr></table><input type="button"  value="showLine1"  onclick="javascript:showLine(0);" /><input type="button"  value="showLine2"  onclick="javascript:showLine(1);" /><input type="button"  value="showLine3"  onclick="javascript:showLine(2);" /><input type="button"  value="showAll"   onclick="javascript:showLine(3);"/></body></html><script type="text/javascript">var trlist = document.getElementsByTagName("tr");function showLine(num){//将所有的tr全部都隐藏;for(i=0;i<trlist.length;i++){trlist[i].style.display="none";}//根据具体的下标来显示所需要看到的内容;if(num==0){trlist[num].style.display="";return;}if(num==1){trlist[num].style.display="";return;}if(num==2){trlist[num].style.display="";return;}if(num==3){for(i=0;i<trlist.length;i++){trlist[i].style.display="";}return;}}</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title></head><body><form action="" method="post" name="userFrm" id="userFrm"><table><tr><td colspan="2">用户登录</td></tr><tr><td>用户名称:</td><td><input type="text" name="userName" id="userName"></input></td></tr><tr><td>用户密码:</td><td><input type="password" name="passWord" id="passWord"></input></td></tr><tr><td colspan="2"><input  type="button"  value="[登 录]" onclick="javascript:getById();" /> <input type="reset"  value="[重 置]"/></td></tr></table></form></body></html><script type="text/javascript">function getInfor(){//userFrm 是 form表单的名字,通过这个名字可以获取到一个Form的对象;//在通过这个对象获取到userName名字对应的组件,//在利用这个获取到的input组件取得这个对象的value值;username = userFrm.userName.value;password = userFrm.passWord.value;if(username==""){window.alert("请输入用户名!");return ;}if(password == ""){window.alert("请输入用户密码!");return ;}window.alert("UserName="+username);window.alert("PassWord="+password);}function $(id){return document.getElementById(id);}function getById(){//如果使用Id属性作为获取HTML元素对象的方式;//那么要保证这个文档中没有一个id属性内容是相同的;username = $("userName").value;password = $("passWord").value;window.document.write("UserName:"+username+"<br>");window.document.write("PassWord:"+password);}</script>

————————————————————————————————————————————————————————————————————————————————————————————

javascript 注册页面

reg.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>无标题文档</title></head><body><form name="regFrm"><table><thead><tr><td colspan="2">用户注册</td></tr></thead><tbody><tr><td>用户名:</td><td><input type="text" name="username" size="15"/></td></tr><tr><td>密码:</td><td><input type="password" name="password" size="15"/></td></tr><tr><td>性别:</td><td><select name="sex"><!-- selected属性表示默认选中 --><option value="male" selected="selected">男</option><option value="female">女</option></select></td></tr><tr><td>地址:</td><td><input type="text" name="address" size="40"/></td></tr></tbody><tfoot><tr><td align="center" colspan="2"><input type="button" value="[注 册]" onclick="javascript:sendTo();"/></td></tr></tfoot></table></form></body></html><script type="text/javascript" language="javascript">function sendTo(){regFrm.action="send.html";regFrm.method="get";regFrm.submit();//提交数据;}</script>

send.html页面

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>无标题文档</title></head><body><table width="40%"><thead><tr><td colspan="2">获取到reg.html的注册信息</td></tr></thead><tbody><tr><td width="20%">用户名:</td><td width="80%" id="userName"></td></tr><tr><td>密码:</td><td id="passWord"></td></tr><tr><td>性别:</td><td id="sex"></td></tr><tr><td>地址:</td><td id="address"></td></tr></tbody></table></body></html><script type="text/javascript" language="javascript">//获取URLvar url = window.location;//window.alert(url);function get(id){return document.getElementById(id);}function setValues(){//这个方法就是将URL进行解析,然后添加到对应的td元素中;url = new String(url);url = url.split("?");//window.alert(url[1]);url = url[1].split("&");//window.alert(url);for(i=0;i<url.length;i++){str = url[i].split("=");if(str[0]=="username"){get("userName").innerHTML="<font color='red'>"+str[1]+"</font>";}if(str[0]=="password"){get("passWord").innerHTML="<font color='blue'>"+str[1]+"</font>";}if(str[0]=="sex"){get("sex").innerHTML=str[1];}if(str[0]=="address"){get("address").innerHTML=str[1];}}}setValues();</script>