JavaScript在Web页面里添加JavaScript,JavaScript代码是和页面内容一起发送给浏览器的,这是如何做到的呢?有两种方法可以把JavaScript代码关联到HTML页面,它们都要用到<script>
和</script>
标签。
第一种方法是把JavaScript语句直接包含在HTML文件里:
<script>
... Javascript statements are written here ...
</script>
第二种方法,也是更好的方法,是把JavaScript代码保存到单独的文件,然后利用<script>
元素的src(源)属性来指定文件名,从而把这个文件包含到页面里:
<script src=′mycode.js′></script>
前例包含了一个名为mycode.js的文件,其中有我们编写的JavaScript语句。如果JavaScript文件与调用脚本不在同一个文件夹,就需要添加一个相对或绝对路径:
<script src=′/path/to/mycode.js′></script>
或
<script src=′http://www.example.com/path/to/mycode.js′></script>
把JavaScript代码保存到单独的文件中有如下好处。
➢ 当JavaScript代码有更新时,这些更新可以立即作用于使用这个JavaScript文件的页面。这对于JavaScript库是尤为重要的。
➢ HTML页面的代码可以保持简洁,从而提高易读性和可维护性。
➢ 可以稍微提高一点性能。浏览器会把包含文件进行缓存,当前页面或其他页面再次需要使用这个文件时,就可以使用一个本地副本了。
说明:文件名后缀
按照惯例,JavaScript代码文件的名称扩展名是.js
。但从实际情况来看,代码文件的名称可以使用任何扩展名,浏览器都会把其中的内容当作JavaScript来解释。
注意:留意标记
外部文件中的JavaScript语句不能放到<script>
和</script>
标签中,也不能使用任何HTML标签,只能是纯粹的JavaScript代码。
可以在<body>
区域里包含一个JavaScript代码文件。JavaScript可以放置到HTML页面的<head>
或<body>
区域里,但一般情况下,我们把JavaScript代码放到页面的<head>
区域,从而让文档的其他部分能够调用其中的函数。就目前而言,我们把范例代码暂时放到文档的<body>
区域。
程序清单 包含了一个JavaScript文件的一个HTML文档
<!DOCTYPE html>
<html>
<head>
<title>A Simple Page</title>
</head>
<body>
<p>Some content ...</p>
<script src=′mycode.js′></script>
</body>
</html>
当JavaScript代码位于文档的body区域时,在页面被呈现时,遇到这些代码就会解释和执行。为此,JavaScript代码不要试图访问没有定义的DOM元素,这一点很重要。相反,JavaScript语句必须包含在定义这些元素的HTML的后面。在代码读取和执行完毕之后,页面呈现才会继续,直到页面完成。
提示:多个脚本
你并不是只能够使用一个script元素,需要的话,可以在页面中使用任意多个script元素。
说明:HTML注释
有时在<script>
标签里可以看到HTML风格的注释标签<!--
和-->
,它们包含着JavaScript语句,比如:
<script>
<!--
... Javascript statements are written here ...
-->
</script>
这是为了兼容不能识别<script>
标签的老版本浏览器。这种“注释”方式可以防止老版本浏览器把JavaScript源代码当作页面内容显示出来。除非我们有特别明确的需求要支持老版本的浏览器,否则是不需要使用这种技术的。
酷客网相关文章:
评论前必须登录!
注册