事半功倍之&#106avascript(2)

王朝html/css/js·作者佚名  2006-11-24
窄屏简体版  字體: |||超大  

第五章 使用函数

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=go.gif onmouseover=document.images[0].src='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=**.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=freddy.src>

,<img src="blank.gif">

</body>

11.改变图像

<img src=freddy.gif><br>

<form name=form1>

<input type=button name=button1 value="改变图像" onclickd=document.images[0].src=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>

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有 導航