⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 javascript 简介 ─ 第 2 集.htm

📁 javascrip的几个基础实例
💻 HTM
字号:
🔍 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0058)http://homepage.qdcatv.com.cn/lkw/javascript/javascr2.html -->
<HTML><HEAD><TITLE>JavaScript 简介 ─ 第 2 集</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<SCRIPT language=LiveScript>



<!-- Hiding


     function hello() {


       alert("哈罗!");


     }


     function RandomNumber() {


       timenow=new Date();


       num=Math.abs(Math.sin(timenow.getHours()*timenow.getMinutes()*timenow.getSeconds()));


       return num;  


     }


     function WinOpen() {


       msg=open("","DisplayWindow","toolbar=no,directories=no,menubar=no");


       msg.document.write("<HEAD><TITLE>哈罗!</TITLE></HEAD>");


       msg.document.write("<CENTER><H1>酷毙了!</H1><h2>这是<B>JavaScript</B>所开的视窗!</h2></CENTER>");


     }


// -->



</SCRIPT>

<SCRIPT language=LiveScript>



function RandomNumber() {


  today = new Date();


  num = Math.abs(Math.sin(today.getTime()));


  return num;  


}



</SCRIPT>

<SCRIPT language=LiveScript>



function WinOpen() {


   msg=open("","DisplayWindow","toolbar=no,directories=no,menubar=no");


   msg.document.write("<HEAD><TITLE>哈罗!</TITLE></HEAD>");


   msg.document.write("<CENTER><H1>酷毙了!</H1><h2>这是<B>JavaScript</B>所开的视窗!</h2></CENTER>");


}



</SCRIPT>

<META content="MSHTML 6.00.2719.2200" name=GENERATOR></HEAD>
<BODY background="JavaScript 简介 ─ 第 2 集.files/ee.jpg"><FONT color=#ff0000 
size=6>
<P align=center>JavaScript 简介<BR></FONT><FONT color=blue size=4>第 2 集</FONT> 
</P>
<HR align=center width="80%" SIZE=2>

<P><BR><BR><A name=status><FONT color=green size=+2>范例 5：</FONT></A></P>
<P>在这一部分首先要为你展示的 JavaScript 特性是将你的滑鼠移到这个不同颜色</P>
<P>的<A onmouseover="window.status='Just another stupid link...'; return true" 
href="http://homepage.qdcatv.com.cn/tppmsgs/msgs0.htm#44" 
tppabs="http://202.96.217.5/~xiaoyi/tpage.htm">连结</A>上面，此时看看浏览器下的状态列有何结果。然後这样的功能我们可以</P>
<P>与 JavaScript 的功能相结合。好，现在再将你的滑鼠移到本处不同颜色的<A onmouseover=hello() 
href="">连结</A>上</P>
<P>面，你应该会发现有一个视窗出现，是吧？！如何！怎麽做到的呢？以下就是</P>
<P>这一个连结的作法： </P><PRE>
&lt;a href="tpage.htm" onMouseOver="window.status='Just another stupid link...'; return true"&gt;

</PRE>
<P>在这儿你只要在传统 &lt;a&gt; 的标签中加入 <I>onMouseOver</I> 的 method，就可达成你要的</P>
<P>效果了。这里的<I> window.status</I> 是用来让你可以在 WWW 浏览器的状态列上显示</P>
<P>一些讯息用的。在语法中，你可以看到讯息部分是用 ' 括起来的部分，而非以 " 括</P>
<P>起来，在讯息部分结束之後，必须加上 <I>; return true</I>。 </P>
<P>好了，利用以上的特性可以很简单的完成第二个连结的例子！相当简单，以 </P>
<P><I>onMouseOver</I> 的 method 然後配合事件发生时去呼叫函数 <I>hello()</I> 就行了，不再</P>
<P>多加解释了，作法如下： </P><PRE>

&lt;html&gt;
&lt;head&gt;
&lt;script language="LiveScript"&gt;
&lt;!-- Hiding
     function hello() {
       alert("哈罗!");
     }
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;a href="" onMouseOver="hello()"&gt;link&lt;/a&gt;
&lt;/body&gt;
&lt;/html&gt;
</PRE>
<HR align=center width="80%" SIZE=2>

<P><A name=date><FONT color=green size=+2>范例 6：</FONT></A> </P>
<P>接下来我们要告诉你一个使用日期和时间的例子。在第一部分中，你已看过了 </P>
<P><I>lastModified</I> 的用法和作法。现在要告诉你的并非是印出网路上伺服器或文件</P>
<P>修改日期，而是你个人客户端机器的日期和时间。以下就是执行结果： <BR><BR>现在时间是： 15:32<BR>今天日期为： 10/11/98 </P>
<P>做法如下： </P>
<P>　<FONT size=3></P>
<P align=justify>&lt;script language="LiveScript"&gt;<BR>&lt;!-- Hiding<BR>today 
= new Date()<BR>document.write("<FONT face=宋体 size=3>现</FONT> <FONT face=宋体 
size=3>在</FONT> <FONT face=宋体 size=3>时</FONT> <FONT face=宋体 size=3>间</FONT> 
<FONT face=宋体 size=3>是：</FONT> 
",today.getHours(),":",today.getMinutes())<BR>document.write("&lt;br&gt;<FONT 
face=宋体 size=3>今</FONT> <FONT face=宋体 size=3>天</FONT> <FONT face=宋体 
size=3>日</FONT> <FONT face=宋体 size=3>期</FONT> <FONT face=宋体 size=3>为：</FONT> ", 
today.getMonth()+1,"/",today.getDate(),"/",today.getYear());<BR>// end hiding 
contents --&gt;<BR>&lt;/script&gt;</P></FONT>
<P>在本例中，我们必需首先建立一个日期变数，这可以由 <I>today= new Date()</I>来完成。</P>
<P>如果没有特别指定时间与日期的话，浏览器将会采用本地客户端机器的时间，若将</P>
<P>它放入变数 <I>today</I> 中。这儿要注意的是：我们并没有宣告 <I>today</I> 这个变数的型态，</P>
<P>这和 Java 或其他的程式语言在用到变数之前必需先加以宣告的方式有相当大的不</P>
<P>同。在完成<I> today</I> 的日期变数後，我们等於建立了一个具有本地时间与日期的物件</P>
<P>(object)。接著就可以使用 <I>get... </I>的 method 以取得<I> today</I> 这个物件的时间和日期。</P>
<P>请注意 <I>getMonth</I> 这个 method 所取得的月份范围是由 0~11，所以必须加 1 以代</P>
<P>表真正的 1 月至 12 月。看完以上的例子後，想想你可以使你的文件变得有点</P>
<P>智慧，例如：某个文件有时效限制的话，你可以利用我们在上一部份的<A 
href="http://homepage.qdcatv.com.cn/tppmsgs/msgs0.htm#45" 
tppabs="http://202.96.217.5/~xiaoyi/javascr.htm#ex4">范例 4</A></P>
<P>中所提到的功能和这一个范例中所学习到的功能，设计一个让你的文件在 第10天</P>
<P>以後读到的话就会告诉读者："喂！这篇已过时了！"的程式，试试看，并不难！</P>
<P><BR>除以上功能外，在建立日期物件时你也可以事先设定日期如下：</P>
<P align=center><I>docStarted= new Date(96,0,13)</I></P>
<P>首先是年（西元），接著是月（但记得减 1），再接著是日。同样的方法也可以</P>
<P>加上时间的设定，如下：</P>
<P align=center><I>docStarted = new Date(96,0,13,10,50,0)</I></P>
<P>前三个是日期的年、月、日，接著是时、分、秒。最後，我们必须提醒你，</P>
<P>JavaScript 并没有实际的日期型态，但是它却能毫不费力地显示出日期和时间，</P>
<P>原因是它是从 1 / 1 / 1970 0：0h 开始以 ms(milli seconds) 来计算目前的时间的，</P>
<P>这听起来似乎有些复杂，但你倒不用担心，它有标准的共用函数可以 计算，</P>
<P>你只要知道如何用就可以了！ <BR></P>
<HR align=center width="80%" SIZE=2>

<P><A name=random><FONT color=green size=+2>范例 7：</FONT></A> </P>
<P>接下来我们要为你介绍一个可以产生乱数的函数，也是以 JavaScript 所写的。</P>
<P>这个函数只是利用了一点小技巧而已，而这种技巧在大部分的编译器(compiler)中，</P>
<P>大都是如此（或类似）计算出乱数来的。我相信 JavaScript 最後应也会以相似的方</P>
<P>法来产生这样的 method ，如果它会提供这样功能的话。以下是此函数的结果： </P>
<P>这是一个计算产生的乱数： .17577887797942549 </P>
<P>以下是这个作法的写法： </P>
<P>　<FONT size=3></P>
<P align=justify>&lt;html&gt;</P>
<P align=justify>&lt;head&gt;</P>
<P align=justify>&lt;script language="LiveScript"&gt;</P>
<P align=justify>function RandomNumber() {</P>
<P align=justify>today = new Date();</P>
<P align=justify>num = Math.abs(Math.sin(today.getTime()));</P>
<P align=justify>return num; </P>
<P align=justify>}</P>
<P align=justify>&lt;/script&gt;</P>
<P align=justify>&lt;/head&gt;</P>
<P align=justify>&lt;body&gt;</P>
<P align=justify>&lt;script language="LiveScript"&gt;</P>
<P align=justify>&lt;!--</P>
<P align=justify>document.write("This is a random number:", RandomNumber());</P>
<P align=justify>// --&gt;</P>
<P align=justify>&lt;/script&gt;</P>
<P align=justify>&lt;/body&gt;</P>
<P align=justify>&lt;/html&gt;</FONT></P>
<SCRIPT language=LiveScript>



<!--


  document.write("This is a random number:", RandomNumber());


// -->



</SCRIPT>

<P>我们的做法是以上一个范例中的时间函数；它会出现一个很大的数，</P>
<P>利用这个数再加以运算即可！例如：将它拿来做正弦函数（sin）的运</P>
<P>算，得到的数再做绝对值的运算，结果可以得到一个介於 0 与 1 间的</P>
<P>实数。因为时间的改变是 ms 为单位，而且你绝不会获得相同的数字。</P>
<P>不过这个做法并不适合拿来快速的连续产生一系列的乱数，但如果你</P>
<P>是不定时，久久的用一次，那效果就不错了！ </P>
<HR align=center width="80%" SIZE=2>

<P><A name=win><FONT color=green size=+2>范例 8：</FONT></A> </P>
<P>JavaScript 的一个重要特点是它可以制作视窗。你可以产生一个的视窗，并且</P>
<P>在此视窗中载入 HTML 文件，完全以 JavaScript 来航游网际网路（Internet ）。</P>
<P>接下来的范例就是告诉你如何开启一个视窗并且写点东西进去，你可先试试</P>
<P>按一下范中之接 钮看看！ </P>
<FORM>
<P><INPUT onclick=WinOpen() type=button value="Push me" name=Button1> 
</P></FORM>
<P>原始程式如下： </P>
<P>　<FONT size=3></P>
<P align=justify>&lt;html&gt;</P>
<P align=justify>&lt;head&gt;</P>
<P align=justify>&lt;script language="LiveScript"&gt;</P>
<P align=justify>function WinOpen() {</P>
<P 
align=justify>msg=open("","DisplayWindow","toolbar=no,directories=no,menubar=no");</P>
<P align=justify>msg.document.write("&lt;HEAD&gt;&lt;TITLE&gt;</FONT><FONT 
face=宋体 size=3>哈</FONT><FONT size=3> </FONT><FONT face=宋体 size=3>罗</FONT><FONT 
size=3>!&lt;/TITLE&gt;&lt;/HEAD&gt;");</P>
<P align=justify>msg.document.write("&lt;CENTER&gt;&lt;H1&gt;</FONT><FONT 
face=宋体 size=3>酷</FONT><FONT size=3> </FONT><FONT face=宋体 size=3>毙</FONT><FONT 
size=3> </FONT><FONT face=宋体 size=3>了</FONT><FONT 
size=3>!&lt;/H1&gt;&lt;h2&gt;</FONT><FONT face=宋体 size=3>这</FONT><FONT size=3> 
</FONT><FONT face=宋体 size=3>是</FONT><FONT 
size=3>&lt;B&gt;JavaScript&lt;/B&gt;</FONT><FONT face=宋体 size=3>所</FONT><FONT 
size=3> </FONT><FONT face=宋体 size=3>开</FONT><FONT size=3> </FONT><FONT face=宋体 
size=3>的</FONT><FONT size=3> </FONT><FONT face=宋体 size=3>视</FONT><FONT size=3> 
</FONT><FONT face=宋体 size=3>窗</FONT><FONT 
size=3>!&lt;/h2&gt;&lt;/CENTER&gt;");</P>
<P align=justify>}</P>
<P align=justify>&lt;/script&gt;</P>
<P align=justify>&lt;/head&gt;</P>
<P align=justify>&lt;body&gt;</P>
<P align=justify>&lt;form&gt;</P>
<P align=justify>&lt;input type="button" name="Button1" value="Push me" 
onclick="WinOpen()"&gt;</P>
<P align=justify>&lt;/form&gt;</P>
<P align=justify>&lt;/body&gt;</P>
<P align=justify>&lt;/html&gt;</FONT></P><PRE>
</PRE>
<FORM><PRE><INPUT onclick=WinOpen() type=button value="Push me" name=Button1>


</PRE></FORM>
<P>这儿你又看到用按钮来启动函数。这次的函数 <I>WinOpen()</I>是藉著一个 <I>open</I></P>
<P>的 method 来产生一个新的视窗。第一对双引号("")是用来描述欲载入至视窗</P>
<P>中的文件 URL 位置。如果留者空白的话，那就会呈现一个空白视窗，并可以</P>
<P>透过 JavaScript 写入东西！下一对双引号内的内容是这个新开启视窗的名字，</P>
<P>你可以喜欢给它任意一个名字，但不可加入空白，如用<I> Display Window </I>的话便</P>
<P>会出现错误讯息，请注意。接下来的一连串双引号内所 指定的是该视窗</P>
<P>的相关性质(properties)，这些蛮有趣的，你可以指定要不要有工具棒(toolbar) 、</P>
<P>卷轴(scrollbar)，等等，例如：如果你写 <I>toolbar = yes</I>，那就会在你所产生出</P>
<P>来的视窗中出现一排工具列。以下有许多你可以改变的视窗特性，请注意它们</P>
<P>字中间不可以有空白： </P>
<P>toolbar<BR>location<BR>directories<BR>status<BR>menubar<BR>scrollbars<BR>resizable<BR>copyhistory<BR>width=<I>pixels</I><BR>height=<I>pixels</I><BR></P>
<P>以上的<I> pixels</I> 部分，你可以填入点数的数值，这数值是告诉浏览器这个视窗的</P>
<P>大小。在开启视窗，并且将它称为 <I>msg</I> 以後，就可以开始写些东西到视窗中了。</P>
<P>你可以写入一般正规的 HTML 语法文字。哇！这可不得了了，也就是说，你可以</P>
<P>利用先前使用者在 form 表格中输入给你的文章直接将它回应至浏览器上来了！这些</P>
<P>功能在几个月前大概还只能用 CGI 才能达到喔！现在你不用 CGI 也可以做了！</P>
<HR align=center width="80%" SIZE=3>

<P align=center><A 
href="http://homepage.qdcatv.com.cn/lkw/javascript/script.htm" target=_top 
tppabs="http://202.96.217.5/~xiaoyi/script.htm">回主目录</A></P>
<HR align=center width="80%" SIZE=2>

<P align=center>希望你能对我的介绍感到还算不错。由於 JavaScript 尚未完全发展完成，</P>
<P align=center>并且很可能会再继续地做一些更动，希望这儿的范例到时都还能执行，在</P>
<P align=center>JavaScript 更多特性完成後，我也会继续地再为你介绍一些新的范例的！ <BR></P>
<HR align=center width="80%" SIZE=3>
</BODY></HTML>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -