荔园在线

荔园之美,在春之萌芽,在夏之绽放,在秋之收获,在冬之沉淀

[回到开始] [上一篇][下一篇]


发信人: hbo (H.B.), 信区: Java
标  题: (转贴)JavaScript 简介(第 1 集)
发信站: 深大荔园晨风站 (Thu Mar 12 09:37:52 1998), 转信

寄信人: VINCENT
标  题: (转贴)JavaScript 简介(第 1 集)
发信站: 华南理工大学 BBS木棉站
日  期: Tue Oct 15 12:04:29 1996

JavaScript 是什么?



JavaScript 是一种新的描述语言,此一语言可以被箝入 HTML 的文件之中。

透过 JavaScript 可以做到回应使用者的需求事件 (如∶ form 的输入) 而不用任何的网路


来回传输资料,所以当一位使用者输入一项资料时,它不用经过传给伺服端 (server)

处理,再传回来的过程,而直接可以被客户端 (client) 的应用程式所处理。你也可

以想像成有一个可执行程式在你的客端上执行一样!目前已有一些写好的程式在

Internet 上你可以连过去看看,以下有一些计算器的例子,在 Nescape 上。

JavaScript 和 Java 很类似,但到底并不一样! Java 是一种比 JavaScript 更复杂

许多的程式语言,而 JavaScript 则是相当容易了解的语言。JavaScript 创作者

可以不那么注重程式技巧,所以许多 Java 的特性在 Java Script 中并不支援。

如需相关的更多资讯,可以去读读 Netscape 的有关 Netscape JavaScript 之介绍。





如何执行 JaveScript?



JavaScript 如何执行呢?

Netscape 2.0 beta 3 版以上,就可以执行 JavaScript 的功能了,我们测试过至少

beta 3 版以上可以,或许 beta 2 版就已经有此功能了(猜的)。但目前为止,

除了 Netscape 外,似乎尚没有其他种类的 WWW 浏览器有此一功能。不过,

资讯科技变化脚步是很快的,也许说著说著就有一大堆出来了。

如果你没有 Netscape Navigator 2.0 的话,建议去取得该程式。目前最新版是

Netscape 2.01 版!而 Netscape 3.0 beta4 版都出来了 呢!



范例 1∶

以下我们就以一些例子来告诉你如何将 JavaScript 写在 HTML 文件中,并且体会

一下新语言的特性,我们从第一个例子开始∶如何用 JavaScript 印出一串文字至

HTML 文件中∶

<html>

<head>

My first JavaScript!

</head>

<body>




This is a normal HTML document.




<script language="LiveScript">

document.write("这是以 JavaScript 印出的!")

</script>




Back in HTML again.

</body>

</html>


如果你使用的 WWW 浏览器是 Netscape 2.0 beta 3 以上版本的话,那你就可以

看到相关的结果,而如果你的浏览器并非是可以支援 JavaScript 的话,那看起

来就会有一些怪怪的了,以上范例的结果如下∶

This is a normal HTML document.
这是以 JavaScript 印出的!
Back in HTML again.

此一范例并没有太大的用处,它只是要告诉你如何使用<script>的标签,并

如何将它置於 HTML 的文件之中而已,这个新的标签你可以特它放在文件

中的任何地方。


范例 2∶

接下来下一个例子所要介绍的是有关函数 (function) 的使用。请放心,函数并

非很难懂的东西,但它却相当有用。函数通常是在 HTML 文件中 <body >的

部份被呼叫,而理所当然地,它最好事先被宣告并放在 HTML 文件中 <body>

的部份。好让在 <body> 部分中使用到函数时,它已确定被读取住来。另外,

<script> 标签的有关描述语法剖份,你可以用注解的符号将它括起来,以免旧

版或无法读取 JavaScript 的浏览器读到,而误会了意思!


<html>

<head>

<script language="LiveScript">

function pushbutton() {

alert("嗨! 你好");

}

</script>

</head>

<body>

<form>

<input type="button" name="Button1" value="Push me" onclick="pushbutton()">

</form>

</body>

</html>



如果你是使用 Netscape 2.0 beta 3 以上的浏览器,那以上 JavaScript 语法部份

的结果如下,你可以试著按按钮看看有何结果产生!



在范例 2 中,将会产生一个按钮,当你用滑鼠去按它的时候,应该会出现

一个视窗上面有“嗨! 你好”的字串,如何?不错吧!这个结果是如何产生

的呢?首先,在 <head>内的函数会被载入并存於记忆体中,接著一个新

的 <form>标签 <input type ="button".....>将产生一个接钮。然後,你可以

在後面看到 'onClick' 的指令,这就是告诉浏览器,当该按钮被按时,应会执行

onClick 後的函数 'pushbutton()',而这个函数在刚刚程式被载入时就已安放在

记忆体中了!请注意,在这个函数中我们用到了个新东西━ alert 的 method,

是 JavaScript 事先定义好的,它会以对话视窗产生内涵的讯息,并有一"确定"

(OK)的按钮。 JavaScript 定义了许多的 method,你可以连至 Netscape 公司去

获取较完整的讯息。我想这些 method 在不久的将来会有长长的一串可以够你

学的,不过目前的 method 也已经可以做出相当多东西了!

接著下个例子将告诉你如何由一个输入型表格中读入使用者的输入资料,

事实上,这也是加入个函数就可以达成的。



范例 3∶


<html>

<head>

<script language="LiveScript">

<!-- hide script from old browsers

function getname(str) {

alert("哈罗! "  str "!");

}

// end hiding contents -->

</script>

</head>

<body>

Please enter your name:

<form>

<input type="text" name="name" onBlur="getname(this.value)" value="">

</form>

</body>

</html>



现在你可以试试结果如何∶

请输入你的名字∶



在这个例子中又有新的东西了。首先,让我们注意一下,在语法中的注解部分

(<!- ... ->) 此部分即我们之前所提到的它可以避免旧版本或是不支援 JavaScript

的 WWW 浏览器因为不认识这些函数而产生错误。它的顺序应 该为 <script>

先,接著为注解的开头 <!-,然後是内容,注解尾 ->, 最後是 </script>。

另外要注意的一点是,语解尾那一行的开头双斜线 "//" ,不可以省略,它代表了

JavaScript 的注解,若省略了的话, ->之前的字会被误认为是 JavaScript 的指令。

这个例子可以让使用者输入一段文字,然後再输入完毕後经由 <input>标签中的

"onBlur" 事件函数侦知,於是呼叫 Getname(Str)这个函数来加以取得输入字串,

并将它显示在对话视窗上!函数 Getname(this.value) 中的 "this.value" 是你在文

字输入格式中所输入的值。



范例 4∶∶

这个范例更是帅了!我们在 HTML 文件档完成了以後,常会加上一行文件

最後修改的日期,现在你可不用担心每次都要去改或是忘了改了。你可以

很简单的写一个如下的描述语法程式,就可以自动的为你每次产生最後修

改的日期了∶


<html>

<body>

This is a simple HTML- page.




Last changes:

<script language="LiveScript">

<!-- hide script from old browsers

document.write(document.lastModified)

// end hiding contents -->

</script>

</body>

</html>


以上的 document.lastModified 参数在 Netscape 2.0 beta 2 版时是被写成

documeut.lastmodified 的,然而,之後的版本就改为 document.lastModified,

所以注意一下 ;JavaScript 本身是会区分大小写的, lastmodified 与 lastModified

在它看来是不同的结果。

最後,在这一部分结束之前,要提醒你一点,像范例 4 ,的用法并非每一部

机器都是一样的,例如∶PC 上跑得很正确的,在工作站上不一定会有相同的

结果,所以,或许你仍得测一测不同机器的结果才会有所定论。当然,这一切

是因为 JavaScript 还正在发展的原因,最新的讯息还是得去拜访一下Netscape

公司才知道。也许你也不用奇怪,当你隔周再来访时,JavaScript 可能又作了

相当大的改变了呢! .


--
※ 来源:.深大荔园晨风站 bbs.szu.edu.cn.[FROM: 202.192.140.143]


[回到开始] [上一篇][下一篇]

荔园在线首页 友情链接:深圳大学 深大招生 荔园晨风BBS S-Term软件 网络书店