天天看点

《JavaScript入门经典(第6版)》——第2章 创建简单的脚本2.1 在Web页面里添加JavaScript

本节书摘来自异步社区《javascript入门经典(第6版)》一书中的第2章,第2.1节,作者: 【美】 phil ballard 译者:李 军陈冀康,更多章节内容可以访问云栖社区“异步社区”公众号查看。

javascript入门经典(第6版)

本章主要内容包括:

在web页面里添加javascript的各种方式

javascript语句的基本语法

声明和使用变量

使用算术操作符

代码的注释

捕获鼠标事件

第1章介绍了javascript是一种能够让web页面更具有交互性的脚本语言。

本章将介绍如何向web页面添加javascript,以及编写javascript程序的一些基本语法,比如语句、变量、操作符和注释。同时,本章将涉及更加实用的脚本范例。

正如上一章所介绍的,javascript代码是和页面内容一起发送给浏览器的,这是如何做到的呢?有两种方法可以把javascript代码关联到html页面,它们都要使用第1章介绍的标签。

第一种方法是把javascript语句直接包含在html文件里,就像上一章所介绍的一样。

《JavaScript入门经典(第6版)》——第2章 创建简单的脚本2.1 在Web页面里添加JavaScript

第二种方法,也是更好的方法,是把javascript代码保存到单独的文件,然后利用< script>元素的src(源)属性来指定文件名,从而把这个文件包含到页面里。

《JavaScript入门经典(第6版)》——第2章 创建简单的脚本2.1 在Web页面里添加JavaScript

前例包含了一个名为mycode.js的文件,其中有我们编写的javascript语句。如果javascript文件与调用脚本不在同一个文件夹,就需要添加一个相对或绝对路径:

《JavaScript入门经典(第6版)》——第2章 创建简单的脚本2.1 在Web页面里添加JavaScript

《JavaScript入门经典(第6版)》——第2章 创建简单的脚本2.1 在Web页面里添加JavaScript

把javascript代码保存到单独的文件中有不少好处:

当javascript代码有更新时,这些更新可以立即作用于使用这个javascript文件的页面。这对于javascript库是尤为重要的(本书稍后会有介绍)。

html页面的代码可以保持简洁,从而提高易读性和可维护性。

可以稍微提高一点性能。浏览器会把包含文件进行缓存,当前页面或其他页面再次需要使用这个文件时,就可以使用一个本地副本了。

说明:按照惯例,javascript代码文件的名称后缀是.js。但从实际情况来看,代码文件的名称可以使用任何后缀,浏览器都会把其中的内容当作javascript来解释。

注意:外部文件中的javascript语句不能放到标签中,也不能使用任何html标签,只能是纯粹的javascript代码。

程序清单2.1是第1章里web页面的代码,但是现在,修改为在

区域里包含了一个javascript代码文件。javascript可以放置到html页面的或区域里,但一般情况下,我们把javascript代码放到页面的区域,从而让文档的其他部分能够调用其中的函数。第3章将介绍函数的有关内容。就目前而言,我们把范例代码暂时放到文档的区域。

程序清单2.1 包含了一个javascript文件的一个html文档

《JavaScript入门经典(第6版)》——第2章 创建简单的脚本2.1 在Web页面里添加JavaScript

当javascript代码位于文档的body区域时,在页面被呈现时,遇到这些代码就会解释和执行,然后继续呈现,直到完成页面的内容。

提示:你并不是只能够使用一个script元素,需要的话,可以在页面中使用任意多个script元素。

说明:有时在< script>标签里可以看到html风格的注释标签,它们包含着javascript语句,比如:

《JavaScript入门经典(第6版)》——第2章 创建简单的脚本2.1 在Web页面里添加JavaScript

这是为了兼容不能识别

继续阅读