JavaScript小技巧全集_第1页
JavaScript小技巧全集_第2页
JavaScript小技巧全集_第3页
已阅读5页，还剩2页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、JavaScript小技巧全集(一)第一集如何用滑鼠控制Web页面在这一部分首先要为你展示的JavaScript特性是将你的滑鼠移到这个不同颜色的连结上面，此时看看浏览器下的状态列有何结果，然后这样的功能我们可以与JavaScript的功能相结合。怎样做到的呢以下就是这一个连结的作法：<ahref="tpage.htm"onMouseOver="window.status='Justanotherstupidlink.'returntrue">在这儿你只要在传统va>的标签中加入onMouseOver的method就可达

2、成你要的效果了。这里的window.status是用来让你可以在WWW浏览器的状态列上显示一些讯息用的。在语法中，你可以看到讯息部分是用括起来的部分，而非以"括起来。在讯息部分结束之后，必须加上；returntrue。好了,利用以上的特性可以很简单的完成第二个连结的例子，相当简单。以onMouseOver的method,然后配合事件发生时去呼叫函数hello()就行了，不再多加解释了。作法如下< html>< head>< scriptlanguage="LiveScript"><!-Hidingfunctionhello

3、()alert("哈罗!");< /script>< /head>< body>< ahref=""onMouseOver="hello()">link</a>< /body>< /html>第二集如何在页面内加入日期我们要告诉你一个使用日期和时间的例子，是从你个人客户端机器获取日期和时间做法如下：scriptlanguage="LiveScript"><!-Hidingtoday=newDate()document.w

4、rite("现在时间是",today.getHours(),":",today.getMinutes()document.write("vbr>今天日期为",today.getMonth()+1,”/”,today.getDate(),"/”,today.getYear();< /endhidingcontents->/script>在本例中，我们必需首先建立一个日期变数，这可以由today=newDate()来完成。如果没有特别指定时间与日期的话，浏览器将会采用本地客户端机器的时间。若将它放入变数t

5、oday中，这儿要注意的是，我们并没有宣告today这个变数的型态。除以上功能外，在建立日期物件时你也可以事先设定日期如下：docStarted=newDate(96,0,13)首先是年，接着是月(但记得减1)，再接着是日。同样的方法也可以加上时间的设定。如下docStartednewDate(96,0,13,10,50,0)JavaScript并没有实际的日期型态，但是它却能毫不费力地显seconds)来计算目前的时间的，这听起来似乎有些复杂。前三个是日期的年、月、日，接着是时、分、秒。最后，我们必须提醒你示出日期和时间，原因是它是从1/1/197000h开始以ms(milli但你倒不用担心

6、，它有标准的共用函数可以计算，你只要知道如何用就可以了。第三集如何在网页上使用history和forward我们来看一个可以让你浏览不同文件的语法，我们这儿所要谈的是结是回到你本身文件的上一个连结文件的话，那和Netscope浏览器连结连到某些我们认为会是这个文件来源的地方，称这个连结叫的上一个连结，所以不同JavaScript，也能提供类似Netscape中法如下所示：back()中所提供的和forward()这两个函数，如果你本身的文件中有一个连back按钮功能是不一样的。例如，在我的文件中，正常的Netscape浏览器中的back按钮，则是回到你历史记录中back,而back按钮的功能，

7、试试这个连结，你可以体会一下回来的感觉，这个语<html><body>vFORMNAME="buttonbar">vINPUTTYPE="button”VALUE="Back"onClick="history.back()">vINPUTTYPE="button”VALUE="JS-Home"onClick="location='script.htm'">vINPUTTYPE="button”VALUE=&q

8、uot;Next"onCLick="history.forward()">v/FORM></body></html>以上你也可以直接写成history.go(-1)与history.go(1)第四集如何使用运算函数这是一个特殊的内建函数eval包括了运算式子为其参数，运算元，并回传一个值.这函数对于运算一个表示的数值字串而言非常有用，举例来看,从FOR晰输入的值总是字串，但你也许想要拿来运算，那我该怎么办？下面的这一个例子包函了输入的文字栏位，应用的运算函数和显示结果的另一区块.假如你打了一个数值运算式在第一个栏位，并且按下了按

9、钮，运算式便会开使运算，vSCRIPTfunctioncompute(obj)(obj.result.value=eval(obj.expr.value)v/SCRIPT>vFORMNAME="evalform">Enteranexpression:vINPUTTYPE=textNAME="expr"SIZE=20>vBR>Result:vINPUTTYPE=textNAME="result"SIZE=20>vBR>vINPUTTYPE="button"VALUE="C

10、lickMe"onClick="compute(this.form)”>V v/FORM>以下是原始语法vHTML>HEAD>VTITLE>浏览器的状态栏V/TITLE>/HEAD>BODYBGCOLOR="#FFFFFF"><SCRIPTlanguage="JavaScript">v!-Hidefunctionstatbar(txt)window.status=txt;)/->v/SCRIPT>CENTER>/CENTERCENTER>B>vF

11、ONTCOLOR="#OOOOFF">/FONTx/B></CENTER>vP>vFORM>vPxFONTCOLOR="#OOOOOO"><INPUTtype="button"name="look"value="显示!"onclick="statbar('嗨这是状态列讯息！');"><INPUTtype="button"name="erase"value=&qu

12、ot;清除!"onclick="statbar('');"></FONT>vBRx/FORM>CENTER>FONTCOLOR="#OOOOOO"></FONTx/CENTER>v/BODY>v/HTML>表示此函数将经由函数呼叫时传一个变数呼叫到函数statbar(txt)在此我们就不再写在这个例子中我们建了二个按钮，此二个按个均会去呼叫statbar(txt)。函数中的txt值进来(我们叫txt但它可代表任意不同的值)你可以见到在产生按钮的vform>标签中,

13、成txt。直接把要显示在状态列上的文字写上去，于是我们可以见到这样的效果，变数txt经由Value'中得它的值，然后传入所呼叫的函数中。所以当你按"显示"的按钮时，statbar(txt)函数被呼叫，然后txt将读入字串"嗨这是状态列讯息"并且传入函数中，这种经由变数传递值的方式，可以使函数相当具有可变性。接着来看第二个按钮”清除”它也呼叫同样的函数，我们并不需要因为传递参数的不同而言两个不同的函数。所以现在我们可以来看看statbar(txt)这个函数做些什么了，其实它相当简单。你只要将txt所要传的文字内容指定给window.status这个

14、变数就可以了。即是window.status=txt,而在清除状态列的时候，只是将空字串写入即可。不过要注意的是必须使用单引号及双引号来区别，这样才容易区分。以下是我们所制作的跑马灯效果的源程序< html>< head>scriptlanguage="JavaScript">v!-Hidevarscrtxt="这儿的讯息可以改为你要告诉别人的话"+"或是注意事项."varlentxt=scrtxt.length;varwidth=100;varpos=1-width;functionscroll()(p

15、os+;varscroller=""if(pos=lentxt)(pos=1-width;)if(pos<0)(for(vari=1;i<=Math.abs(pos);i+)(scroller=scroller+""scroller=scroller+scrtxt.substring(0,width-i+1);else(scroller=scroller+scrtxt.substring(pos，width+pos);window.status=scroller;setTimeout("scroll()",150);/-&

16、gt;< /script>bodyonLoad="scroll();returntrue;">Heregoesyourcoolpage!< /body>v/html>此一程式中我们使用了和上面同样的函数(或部分)setTimeout(.)通知，计时器在时间到时去呼叫scroll()函数，使得跑马灯中的文字往前进一格。在函数的一开始，有一些较罗嗦的计算部分，但这并不难使我们了解，这些计算主要是用来取得跑马灯中的文字应该由那一个位置开始显示的用途。一开始当然是必需加一些空白在字的左边，让文字部分能尽可能靠右，然后再一字字的将空白减少，结果自然

17、就造成字往前移动的效果了。第七集如何去产生舌L数接下来我们要为你介绍一个可以产生乱数的函数，也是以JavaScript所写的这个函数只是利用了一点小技巧而已。而这种技巧在大部分的编译器(compiler)中，大都是如此(或类似)计算出乱数来的。相信JavaScript最后应也会以相似的方法来产生这样的method,如果它会提供这样功能的话，以下是此函数的结果：这是一个计算产生的乱数.3861138662928667以下是这个作法的写法< head>< scriptlanguage="LiveScript">functionRandomNumber()

18、today=newDate();num=Math.abs(Math.sin(today.getTime();returnnum;< /script>< /head>< body>< scriptlanguage="LiveScript">< !-document.write("Thisisarandomnumber:",RandomNumber();/->< /script>< /body>< /html>我们的做法是以上一个范例中的时间函数，它会出现一个很大

19、的数，利用这个数再加以运算即可。例如：将它拿来做正弦函数(sin)的运算，得到的数再做绝对值的运算，结果可以得到一个介於0与1间的实数，因为时间的改变是ms为单位，而且你绝不会获得相同的数字不过这个做法并不适合拿来快速的连续产生一系列的乱数，但如果你是不定时久久的用一次，那效果就不错了。JavaScript小技巧全集(二)第八集如何自动加上最后修改时间我们在HTML文件档完成了以后，常会加上一行文件最后修改的日期。现在你可不用担心每次都要去改或是忘了改了，你可以很简单的写一个如下的描述语法程式。就可以自动的为你每次产生最后修改的日期了。< html>< body>Thi

20、sisasimpleHTML-page.< br>Lastchanges:< scriptlanguage="LiveScript"><!-hidescriptfromoldbrowsersdocument.write(document.lastModified)/endhidingcontents->< /script>< /body>< /html>以上的document.lastModified参数在Netscape2.0beta2版时是被写成documeut.lastmodified的。然而之后的版本就改为document.lastModified。所以注意一下JavaScript本身是会区分大小写的lastmodified与lastModified在它看来是不同的结果。第九集JAVASCRIPT础(1)一、什么是JAVASCRIP府言?JavaScript是一种新的描述语言，此一语言可以被箝入HTML勺文件之中，透过JavaScript可以做到回应使用者的需求事件(如form的输入)而不用任何的网路来回传输资料，所以当一位使用者输入一项

人人文库> 全部分类> 行业资料 > 信息产业

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论