JavaScript的基本写法

首页 > JavaScript基础知识 > JavaScript的基本写法

目录

<script>标签

JavaScript代码通常写在 <script>~</script> 之间。

<script type="text/javascript">
<!--
window.alert("Hello");
// -->
</script>

考虑不支持JavaScript的浏览器

为了防止不支持JavaScript的浏览器把JavaScript代码当作HTML代码直接输出到页面上,需要把JavaScript代码用 <!-- 和 // --> 注释起来。不写 // 的话Netscape会报错,但是现在已经没什么人用了,所以写不写无所谓。

<script type="text/javascript">
<!--
document.write("Hello");
// -->
</script>

可以在 <noscript>~</noscript> 之间写消息让不支持 JavaScript 的浏览器显示。

<script type="text/javascript">
<!--
document.write("Hello");
// -->
</script>
<noscript>
此浏览器不支持JavaScript。
</noscript>

language属性

以前可以使用language属性指定所用JavaScript的版本。下面的代码可以指定只有支持JavaScript 1.2的浏览器才能运行JavaScript代码。

<script language="JavaScript1.2">
<!--
document.write("此浏览器支持JavaScript 1.2");
// -->
</script>

以前的浏览器支持JavaScript版本的情况如下表所示。


IE Netscape
2.*3.*4.*5.* 2.*3.*4.0
4.05
4.06
4.7
6.0
JavaScript ×
JavaScript1.0 ×××× ×××××
JavaScript1.1 ×× ×
JavaScript1.2 ×× ××
JavaScript1.3 ××× ×××
JavaScript1.4 ×××× ××××
JavaScript1.5 ×××× ××××
JScript × ×××××

language属性在HTML4.01里已经被废弃,HTML4.01使用type属性。

type属性

HTML4.01开始用 type 属性代替了language属性,赋值为"text/javascript"。

<script type="text/javascript">
<!--
document.write("Hello");
// -->
</script>

Content-Script-Type

为了指定写在事件句柄(onXxxx="~")里脚本的语言,HTML4.01推荐在 HTML 的 head 部分定义 meta 。如果不写的话,大部分浏览器都可以正确认识JavaScript代码,但可能有一些浏览器无法正确识别。

<html>
<head>
<title>JavaScript Sample</title>
<meta http-equiv="Content-Script-Type" content="text/javascript">
</head>
<body>
   :
<input type="button" value="OK" onclick="~">
   :
</body>
</html>

外部JavaScript文件

Internet Explorer 4.0、Netscape Navigator 3.0 以后,可以导入外部的JavaScript文件。比如说把下面的代码写在名为 test.js 的文件里。

function zaoan() {
    window.alert("Hello");
}

.js文件里只需要写JavaScript的代码部分,不用写 <script> 、 <!-- 和 // -->。然后可以在HTML文件里导入刚才的.js文件。

<html>
<head>
<title>JavaScript Sample</title>
<script type="text/javascript" src="test.js">
</script>
</head>
<body>
   :
<input type="button" value="OK" onclick="zaoan()">
   :
</body>
</html>

如果要导入复数的.js文件,可以这样写。

<script type="text/javascript" src="test1.js"></script>
<script type="text/javascript" src="test2.js"></script>

事件处理

JavaScript代码可以在元素被点击(onClick)或者鼠标悬浮在元素上(onMouseOver)等等情况下被执行,我们把onClick、onMouseOver等叫做事件句柄。下面的例子里,点击了 Click Me 按钮以后会弹出显示 Hello 的对话框。

<form action="#">
<input type="button" value="Click Me"
   onclick="window.alert('Hello')">
</form>

代替URL

Internet Explorer 4.0、Netscape Navigator 3.0 以后版本可以把JavaScript代码写在本来应该是url的地方。

<a href="javascript:alert('Hello')">Click Me</a>