About the author

Author name
Something about me and what I do.
E-mail me Send mail

Calendar

Mo	Tu	We	Th	Fr	Sa	Su
24	25	26	27	28	29	30
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31	1	2	3	4

Disclaimer

The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

<< 杂记 | javascript 全集(二) >>

javascript 全集(一)

Published 5/24/2008 by Denni

Tags: javascript

第一章javascript简介

1.在地址栏输入javascript语句

Javascriptocument.write("显示文字")

2.将javascript嵌入 HTML文档

<script language=javascript>
document.bgColor="blue"
</script>

第二章使用变量和数组

1.声明变量

<script language=javascripe>
Var answer1,answer2,answer3,answer4;
answer1=9;
answer2=2.5
answer3="Milkey May"
answer4=true
</script>

2.使用整数

<script language=javascript>
var decimalNum,hexadecimalNum,octalNum
decimalNum=24
hexadecimalNum=0x24
octalNum=024
document.write("显示十进制数："+ decimalNum+"<br>")
document.write("显示十六进制数："+ hexadecimalNum +"<br>")
document.write("显示八进制数："+ octalNum +"<br>")
</script>

3.使用浮点数

<script language=javascript>
var num1,num2,num3,num4
num1=1234567890000.0
num2=5.14e23
num3=0.0000123456
num4=6.0254e3-4
document.write("浮点数1："+num1+"<br>")
document.write("浮点数2："+num2+"<br>")
document.write("浮点数3："+num3+"<br>")
document.write("浮点数4："+num4+"<br>")
</script>

4.使用布尔值

<script language=javascript>
var answer1,answer2
answer1=true
answer2=false
document.write("显示布尔1："+answer1+"<br>")
document.write("显示布尔2："+answer2+"<br>")
</script>

5.使用字符串

<script language=javascript>
var str1,str2
str1="fdsgdg dsfdsf china"
str2=" 中华人民共和国"
document.write("显示字符串1："+str1+"<br>")
document.write("显示字符串2："+str2+"<br>")
</script>

6.确定变量类型

<script>
var answer1,answer2,answer3,answer4
answer1=9
answer2=2.5
answer3="milky may"
answer4=true
document.write("变量1的类型是："+typeof answer1 +"<br>")
document.write("变量2的类型是："+typeof answer2 +"<br>")
document.write("变量3的类型是："+typeof answer3 +"<br>")
document.write("变量4的类型是："+typeof answer4 +"<br>")
</script>

7.将字符串转换成数字

<script>
var str1="31 days in january"
var int1=parseInt(str1)
document.write("str1的数据类型是："+typeof str1+"<br>")
document.write("int1的数据类型是："+typeof int1+"<br>")
</script>

8.将数字转换成字符串

<script>
var int1=256
var str1=""+int1
document.write("str1的数据类型是："+typeof str1+"<br>")
document.write("int1的数据类型是："+typeof int1+"<br>")
</script>

9.声明数组

<script>
array=new Array(5)
array[0]=1
array[1]=3
array[2]=5
array[3]=7
array[4]=11
document.write("数组是："+array[0]+"
"+array[1]+"
"+array[2]+"
"+array[3]+"
"+array[4])
</script>

10.确定数组元素的个数

<script>
array=new Array(5)
array[0]=1
array[1]=3
array[2]=5
array[3]=7
array[4]=11
document.write("数组是："+array[0]+"
"+array[1]+"
"+array[2]+"
"+array[3]+"
"+array[4]+"<br>")
document.write("数组的元素个数是"+array.length)
</script>

11.将数组转换为字符串

<script>
array=new Array()
array[0]="dark"
array[1]="apple"
array[2]="nebula"
array[3]="water"
str1=array.join()
str2=array.join("
")
document.write(str1+"<br>")
document.write(str2)
</script>

12.对数组排序

<script>
array=new Array()
array[0]="dark"
array[1]="apple"
array[2]="nebula"
array[3]="water"
str1=array.sort()
document.write(str1+"<br>")
</script>

第三章创建表达式

1.使用算术运算符

<script>
var1=12
var2=10
varadd=var1+var2
varsub=var1-var2
varmult=var1*var2
vardiv=var1/var2
varmod=var1%var2
document.write("数据1是："+var1+"<br>")
document.write("数据2是："+var2+"<br>")
document.write("数据相加是："+varadd+"<br>")
document.write("数据相减是："+varsub+"<br>")
document.write("数据相乘是："+varmult+"<br>")
document.write("数据相除是："+vardiv+"<br>")
document.write("数据相除取余数是："+varmod+"<br>")
</script>

2.递增变量和递减变量

<script>
days=1
document.write("输出变量"+days+"<br>")
days++
document.write("递增后变量变为："+days)
</script>

3.创建比较表达式

<script>
daysofmonth=28
if(daysofmonth==28)
month="february"
document.write("days of month:"+daysofmonth+"<br>")
document.write("month:"+month)
</script>

4.创建逻辑表达式

<script>
dayofmonth=28
if(dayofmonth==28
|| dayofmonth==29)
month="february"
document.write("days of month:"+dayofmonth+"<br>")
document.write("month:"+month)
</script>

5.使用条件运算符

<script language="javascript">
stomach="hungry";
time="5:00";
(stomach=="hungry"&&time=="5:00") ? eat =
"dinner":eat="a snack";
document.write("输出结果"+eat);
</script>

6.识别数字

<script>
var1=24;
(isNaN(var1))?document.write("变量var1"+var1+"不是数字")ocument.write("变量var1"+var1+"是数字")
</script>

第四章控制程序流程

1.使用IF –Else语句

<script>
month="december"
date=25
if(month=="december"
&& date==25)
document.write("今天是圣诞节,商店关门")
else
document.write("欢迎,您来商店购物")
</script>

2.使用for 循环

<script>
for (count=1;count<=10;count++)
document.write("输出第"+count+"句"+"<br>")
</script>

3.使用while循环

<script>
count=1
while(count<=15){
document.write("输出第"+count+"句"
+"<br>")
count++}
</script>

4.中断循环

<script>
count=1
while(count<=15){
count++
if(count==8)
break;
document.write("输出第"+count+"句"+"<br>")}
</script>

5.继续循环

<script>
count=1
while(count<=15){
count++
if(count==8)
continue;
document.write("输出第"+count+"句"+"<br>")}
</script>

6.使用javascript定时器

<script>
function rabbit()
{document.write("输出语句")
}
</script>
<body onload=window.setTimeout(rabbit(),5000)>

7.设置定期间隔

<script>
window.setInterval("document.form1.text2.value=document.form1.text1.value",3000)
</script>
<form name=form1>
<input type=text name=text1><br>
<input type=text name=text2><br>
</form>

8.清除超时和间隔

<script>
stop=window.setInterval("document.form1.text2.value=document.form1.text1.value",300)
</script>
<form name=form1>
<input type=text name=text1><br>
<input type=text name=text2><br>
<input type=button name=button1 value=" 清除超时和间隔" onclick=clearInterval(stop)>
</form>

第五章使用函数

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=javascriptocument.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>

Be the first to rate this post

Currently 0/5 Stars.
1
2
3
4
5

E-mail | Kick it! | DZone it! | del.icio.us

Comments (0) | Permalink | Post RSS

Blogger必修:10个能用JavaScript实现的图片特效一般来说，我们在写博客或做网站时都需要对插图做一些效果，比如增加阴影、图片圆角、倒映等等。这些效果一般可以用3个方法实现，一是用PS实现对图片进行修改，二是使用CSS，三是使用JavaScript...javascript 全集(二) 第八章使用窗口 1.在浏览器的状态栏上显示文本 <body onload=window.status="欢迎光临我的站点"> <a href=...符合标准的对联广告代码 lastScrollY=0; function heartBeat(){ var diffY; if (document.documentElement && document.docum...

Add comment

Name*
E-mail* (Will show your Gravatar icon)
Website
Country Country flag

b i u quote

Comment
Preview

Notify me when new comments are added

About the author

Calendar

Archive

Tags

Categories

Blogroll

Disclaimer

javascript 全集(一)

Related posts

Add comment

Dotnetboke

Mo	Tu	We	Th	Fr	Sa	Su
24	25	26	27	28	29	30
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31	1	2	3	4

Mo	Tu	We	Th	Fr	Sa	Su
24	25	26	27	28	29	30
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31	1	2	3	4

Mo	Tu	We	Th	Fr	Sa	Su
24	25	26	27	28	29	30
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31	1	2	3	4