事半功倍之Javascript--(2) 第五章 使用函数 1.声明函数 <script> function quote() { document.write("输出语句") } </script> 2.调用函数 <script> function quote() { document.write("输出语句") } quote() </script> 3.了解全局变量和局部变量 任何不用 var关键字声明的变量都是全局变量,任何在函数外声明的变量都是全局变量 4.将参数传送给函数 <script> function f(item) {document.write("输出参数"+item+"<br>") } f("fgdfgd") f("参数二") </script> 5.从函数返回值 <script> function average(var1,var2,var3) {ave=(var1+var2+var3)/3; document.write("输出结果"); return ave; } document.write(average(34,56,78)) </script> 6.通过HTML链接调用函数 <script> function quote(){ document.write(" 输出字符串") } </script> <a href=javascript:quote()>通过HTML链接调用函数</a> <a href=javascript:Document.write("输出字符")> 通过HTML链接调用函数,直接写javascript语句</a> 第六章 处理事件 1.检查鼠标单击 <form name=form1> <input type=button name=button1 value=hello onclick=document.form1.button1.value='there'> </form> 2.检测双击 <form name=form1> <input type=button name=button1 value=hello onclick=document.form1.button1.value='你单击了按钮' ondblclick=document.form1.button1.value='你双击了该按钮'> </form> 3.创建悬停按钮 <img src=http://www.webjx.com/htmldata/2006-06-08/go.gif onmouseover=document.images[0].src='http://www.webjx.com/htmldata/2006-06-08/go2.gif' onmouseout= document.images[0].src='go.gif'> 4.检测按键 <form name=form1> <input type=text name=text1 value=hello onkeypress="if(window.event.keyCode=='100') document.form1.text1.value='你按了d键'"> </form> 5.设置焦点 <form name=form1> <input type=text name=text1 value=hello onfous=document.form1.text1.value='该文本框获得焦点' onblur=document.form1.text1.value='该文本框失去焦点'> </form> 6.检测下拉菜单选择 <form name=form1> <select name=select1 size=4 onChange=document.form1.text1.value=document.form1.select1.value> <option value="北京">北京</option> <option value="上海">上海</option> <option value="武汉">武汉</option> <option value="天津">天津</option> <option value="大连">大连</option> </select> <input tppe=text name=text1 value=hello> </form> 7.创建网页加载和卸载信息 <body onload=document.form1.text1.value='页面加载完毕' onunload=alert('再见,欢迎再来')> <form name=form1> <input type=text name=text1 value="页面正在加载 ……"> </form> 第七章 使用对象 1.理解对象\属性和方法 <body bgcolor="green"> <script> document.write("页面背景颜色是:"+document.bgColor) document.write("页面前景颜色是:"+document.fgColor) </script> 2.使用网页元素对象 <script> </script> <form name=form1> <textarea name=ta1>dfgfdgfdhfdhdfdfgdf</textarea> <input type=button value="选择文本" onclick=document.form1.ta1.select()> <input type=button value="显示文本" onclick=document.write(document.form1.ta1.value)> </form> 3.使用子对象 <form name=form1> <input type=text name=text1 value=hello> </form> <script> document.form1.text1.value="gdfgfd" </script> <form name=form1> <input type=radio name=radio1>男 <input type=radio name=radio2>女 </script> <script> document.form1.radio1.checked=true </script> 4.使用预定义对象 <script> str1="dgdfgdfgdfhf固定法固定法功夫攻打法" document.write(str1+"<br>") str2=str1.substr(5) document.write(str2+"<br>") document.write("输出圆的面积:"+Math.PI*Math.pow(5.0,2)) </script> 5.创建新对象 <script> today=new Date() document.write("今天是"+(today.getMonth()+1)+"月"+today.getDate()+"日"+"<br>") document.write("现在是:"+today.toLocaleString()) </script> 6.引用当前对象 <form name=form1> <input type=text name=text1 value="dgdgdfgfd" onclick=this.select()> </script> 7.查看对象属性 <script> for(prop in window) {document.write("window."+prop+"="+window[prop]+"<br>");} for(prop2 in location) {document.write("location."+prop2+"="+location[prop]+"<br>");} </script> 8.使用Array对象 <script> array=new Array(10) array[0]="bark" array[1]="apple" array[2]="nebula" array[3]="cookie" array[4]="technology" document.write("数组元素个数是"+array.Length+"<br>") document.write("用 join将数组合并"+array.join(" ")+"<br>") document.write(" 数组排序"+array.sort()) </script> 9.使用 image 对象 <img src=http://www.webjx.com/htmldata/2006-06-08/**.gif alt="图片提示…." border=10> <script> document.write("图片提示是:"+document.images[0].alt+"<br>") document.write("图片边框大小是:"+document.images[0].broder) </script> 10.预加载图像 <script> freddy=new Image() freddy.src=../../freddy.gif </script> <body onload=document.images[0].src=http://www.cnblogs.com/freddy.src> ,<img src="blank.gif"> </body> 11.改变图像 <img src=http://www.cnblogs.com/freddy.gif><br> <form name=form1> <input type=button name=button1 value="改变图像" onclickd=document.images[0].src=http://www.cnblogs.com/dudjp.gif> </form> 12.使用link和anchor对象 <a name=anchor1>锚点1<br> <a href=http://www.microsoft.com>Microsoft</a><br> <a href=http://www.sohu.com>sohu</a><br> <a href=http://www.sina.com.cn>sina</a><br> <script> document.write("本页面共有"+document.links.length+"链接"+"<br>") document.write("本页面共有"+document.anchors.length+"锚点"+"<br>") document.write("第一个链接协议是"+document.links[0].protocol+"<br>") document.write("第一个链接路径是"+document.links[0].pathnamel+"<br>") document.write("第一个链接href是"+document.links[0].hrefl+"<br>") </script> 13.改变链接 <a href =http://www.microsoft.com>link</a> <form name=form1> <input type=button name=button1 value="改变链接" onclick=document.links[0].href='http://www.sohu.com'> </form> 14.使用history对象 <form name=form1> <input type=button name=button1 value="向后返回2页" onclick=window.history.go(-2)> </form>