JavaScript就这么回事.docx

JavaScript就这么回事.docx

《JavaScript就这么回事.docx》由会员分享，可在线阅读，更多相关《JavaScript就这么回事.docx（19页珍藏版）》请在冰豆网上搜索。

JavaScript就这么回事

JavaScript就这么回事（1-5）

（转的一个不错的JavaScript基础教程）2008年01月06日星期日

有些时候你精通一门语言，但是会发现你其实整天在和其它语言打交道，也许你以为这些微不足道，不至于影响你的开发进度，但恰恰是这些你不重视的东西会浪费你很多时间，我一直以为我早在几年前就已经精通JavaScript了，直到目前，我才越来越觉得JavaScript远比我想象的复杂和强大，我开始崇拜它，就像崇拜所有OOP语言一样～

趁着节日的空隙，把有关JavaScript的方法和技巧整理下，让每个在为JavaScript而烦恼的人明白，JavaScript就这么回事！

并希望JavaScript还可以成为你的朋友，让你豁然开朗，在项目中更好的应用～

适合阅读范围：

对JavaScript一无所知～离精通只差一步之遥的人

基础知识：

HTML

JavaScript就这么回事1：

基础知识

1创建脚本块

1:

2:

JavaScriptcodegoeshere

3:

2隐藏脚本代码

1:

2:

--

3:

document.write（“Hello”）;

4:

//-->

5:

在不支持JavaScript的浏览器中将不执行相关代码

3浏览器不支持的时候显示

1:

2:

Hellotothenon-JavaScriptbrowser.

3:

4链接外部脚本文件

1:

5注释脚本

1:

//Thisisacomment

2:

document.write（“Hello”）;//Thisisacomment

3:

/*

4:

Allofthis

5:

isacomment

6:

*/

6输出到浏览器

1:

document.write（“Hello”）;

7定义变量

1:

varmyVariable=“somevalue”;

8字符串相加

1:

varmyString=“String1”+“String2”;

9字符串搜索

1:

2:

--

3:

varmyVariable=“Hellothere”;

4:

vartherePlace=myVariable.search（“there”）;

5:

document.write（therePlace）;

6:

//-->

7:

10字符串替换

1:

thisVar.replace（“Monday”,”Friday”）;

11格式化字串

1:

2:

--

3:

varmyVariable=“Hellothere”;

4:

document.write（myVariable.big（）+“
”）;

5:

document.write（myVariable.blink（）+“
”）;

6:

document.write（myVariable.bold（）+“
”）;

7:

document.write（myVariable.fixed（）+“
”）;

8:

document.write（myVariable.fontcolor（“red”）+“
”）;

9:

document.write（myVariable.fontsize（“18pt”）+“
”）;

10:

document.write（myVariable.italics（）+“
”）;

11:

document.write（myVariable.small（）+“
”）;

12:

document.write（myVariable.strike（）+“
”）;

13:

document.write（myVariable.sub（）+“
”）;

14:

document.write（myVariable.sup（）+“
”）;

15:

document.write（myVariable.toLowerCase（）+“
”）;

16:

document.write（myVariable.toUpperCase（）+“
”）;

17:

18:

varfirstString=“MyString”;

19:

varfinalString=firstString.bold（）.toLowerCase（）.fontcolor（“red”）;

20:

//-->

21:

12创建数组

1:

2:

--

3:

varmyArray=newArray（5）;

4:

myArray[0]=“FirstEntry”;

5:

myArray[1]=“SecondEntry”;

6:

myArray[2]=“ThirdEntry”;

7:

myArray[3]=“FourthEntry”;

8:

myArray[4]=“FifthEntry”;

9:

varanotherArray=newArray（“FirstEntry”,”SecondEntry”,”ThirdEntry”,”FourthEntry”,”FifthEntry”）;

10:

//-->

11:

13数组排序

1:

2:

--

3:

varmyArray=newArray（5）;

4:

myArray[0]=“z”;

5:

myArray[1]=“c”;

6:

myArray[2]=“d”;

7:

myArray[3]=“a”;

8:

myArray[4]=“q”;

9:

document.write（myArray.sort（））;

10:

//-->

11:

14分割字符串

1:

2:

--

3:

varmyVariable=“a,b,c,d”;

4:

varstringArray=myVariable.split（“,”）;

5:

document.write（stringArray[0]）;

6:

document.write（stringArray[1]）;

7:

document.write（stringArray[2]）;

8:

document.write（stringArray[3]）;

9:

//-->

10:

15弹出警告信息

1:

2:

--

3:

window.alert（“Hello”）;

4:

//-->

5:

16弹出确认框

1:

2:

--

3:

varresult=window.confirm（“ClickOKtocontinue”）;

4:

//-->

5:

17定义函数

1:

2:

--

3:

functionmultiple（number1,number2）{

4:

varresult=number1*number2;

5:

returnresult;

6:

}

7:

//-->

8:

18调用JS函数

1:

Linktext

2:

functionName"（）”>Linktext

19在页面加载完成后执行函数

1:

2:

Bodyofthepage

3:

20条件判断

1:

21指定次数循环

1:

22设定将来执行

1:

23定时执行函数

1:

24取消定时执行

1:

25在页面卸载时候执行函数

1:

2:

Bodyofthepage

3:

JavaScript就这么回事2：

浏览器输出

26访问document对象

1:

2:

varmyURL=document.URL;

3:

window.alert（myURL）;

4:

27动态输出HTML

1:

2:

document.write（“

Here’ssomeinformationaboutthisdocument:

3:

document.write（“

”）;

4:

document.write（“

• ReferringDocument:

  “+document.referrer+“

”）;

5:

document.write（“

• Domain:

  “+document.domain+“

”）;

6:

document.write（“

• URL:

  “+document.URL+“

”）;

7:

document.write（“

8:

28输出换行

1:

document.writeln（“a”）;

2:

document.writeln（“b”）;

29输出日期

1:

2:

varthisDate=newDate（）;

3:

document.write（thisDate.toString（））;

4:

30指定日期的时区

1:

2:

varmyOffset=-2;

3:

varcurrentDate=newDate（）;

4:

varuserOffset=currentDate.getTimezoneOffset（）/60;

5:

vartimeZoneDifference=userOffset-myOffset;

6:

currentDate.setHours（currentDate.getHours（）+timeZoneDifference）;

7:

document.write（“ThetimeanddateinCentralEuropeis:

“+currentDate.toLocaleString（））;

8:

31设置日期输出格式

1:

2:

varthisDate=newDate（）;

3:

varthisTimeString=thisDate.getHours（）+“:

”+thisDate.getMinutes（）;

4:

varthisDateString=thisDate.getFullYear（）+“/”+thisDate.getMonth（）+“/”+thisDate.getDate（）;

5:

document.write（thisTimeString+“on“+thisDateString）;

6:

32读取URL参数

1:

2:

varurlParts=document.URL.split（“?

”）;

3:

varparameterParts=urlParts[1].split（“&”）;

4:

for（i=0;i

5:

varpairParts=parameterParts[i].split（“=”）;

6:

varpairName=pairParts[0];

7:

varpairValue=pairParts[1];

8:

document.write（pairName+“：

“+pairValue）;

9:

}

10:

你还以为HTML是无状态的么？

33打开一个新的document对象

1:

2:

functionnewDocument（）{

3:

document.open（）;

4:

document.write（“

ThisisaNewDocument.

5:

document.close（）;

6:

}

7:

34页面跳转

1:

2:

window.location=“

3:

35添加网页加载进度窗口

1:

2:

3:

4:

varplaceHolder=window.open（'holder.html','placeholder','width=200,height=200'）;

5:

6:

7:

8:

9:

Thisisthemainpage

10:

11:

JavaScript就这么回事3：

图像

36读取图像属性

1:

2:

Width

37动态加载图像

1:

2:

myImage=newImage;

3:

myImage.src=“Tellers1.jpg”;

4:

38简单的图像替换

1:

2:

rollImage=newImage;

3:

rollImage.src=“rollImage1.jpg”;

4:

defaultImage=newImage;

5:

defaultImage.src=“image1.jpg”;

6:

7:

8:

onMouseOut=”document.myImage.src=defaultImage.src;”>

9:

39随机显示图像

1:

2:

varimageList=newArray;

3:

imageList[0]=“image1.jpg”;

4:

imageList[1]=“image2.jpg”;

5:

imageList[2]=“image3.jpg”;

6:

imageList[3]=“image4.jpg”;

7:

varimageChoice=Math.floor（Math.random（）*imageList.length）;

8:

document.write（‘’）;

9:

40函数实现的图像替换

1:

2:

varsource=0;

3:

varreplacement=1;

4:

functioncreateRollOver（originalImage,replacementImage）{

5:

varimageArray=newArray;

6:

imageArray[source]=newImage;

7:

imageArray[source].src=originalImage;

8:

imageArray[replacement]=newImage;

9:

imageArray[replacement].src=replacementImage;

10:

returnimageArray;

11:

}

12:

varrollImage1=createRollOver（“image1.jpg”,”rollImage1.jpg”）;

13:

14:

15:

onMouseOut=”document.myImage1.src=rollImage1[source].src;”>

16:

17:

41创建幻灯片

1:

2:

varimageList=newArray;

3:

imageList[0]=newImage;

4:

imageList[0].src=“image1.jpg”;

5:

imageList[1]=newImage;

6:

imageList[1].src=“image2.jpg”;

7:

imageList[2]=newImage;

8:

imageList[2].src=“image3.jpg”;

9:

imageList[3]=newImage;

10:

imageList[3].src=“image4.jpg”;

11:

functionslideShow（imageNumber）{

12:

document.slideShow.src=imageList[imageNumber].src;

13:

imageNumber+=1;

14:

if（imageNumber

15:

window.setTimeout（“slideShow（“+imageNumber+“）”,3000）;

16:

}

17:

}

18:

19:

20:

21:

42随机广告图片

1:

2:

varimageList=newArray;

3:

imageList[0]=“ima