第1章 网页开发基础.ppt

1．函数的定义及调用 在JavaScript中，定义函数是通过function语句实现的。其语法格式如下： 在上述语法中，functionName是必选项，用于指定函数名，在同一个页面中，函数名必须是唯一的，并且区分大小写；parameter1,parameter2,…是可选项，代表参数列表，当使用多个参数时，参数间使用逗号进行分隔，一个函数最多可以有255个参数；statements是必选项，代表用于实现函数功能的语句；return expression是可选项，用于返回函数值，expression为任意表达式、变量或常量。 JavaScript的使用 1.3 JavaScript基础 在JavaScript中，由于函数区分大小写，所以在调用函数时需要注意函数名称大小写。不带参数的函数使用函数名加上括号即可调用，带参数的函数需要根据参数的个数和类型在括号中传递相应的参数进行调用。如果函数有返回值，可以使用赋值语句将函数值赋给一个变量进行返回。 2．事件处理 采用事件驱动是JavaScript语言的一个最基本的特征，所谓的事件是指用户在访问页面时执行的操作。当浏览器探测到一个事件时，比如，单击鼠标或按键，它可以触发与这个事件相关联的事件处理程序。事件处理的过程通常分为三步：发生事件、启动事件处理程序和事件处理程序作出反应。 1.3 JavaScript基础 值得一提的是，在上面的事件处理过程中，要想事件处理程序能够启动，就需要调用事件处理程序，事件处理程序可以是任意JavaScript语句，但通常使用特定的自定义函数（Function）来对事件进行处理。 除onclick事件外，JavaScript中还有很多常用的事件类型，如下表所示。 接下来通过一个案例来演示如何在HTML中调用事件处理程序，请查看教材文件1-14。 案例代码 1.3 JavaScript基础 3．常用对象 （1）window对象 window对象表示整个浏览器窗口，它处于对象层次的顶端，可用于获取浏览器窗口的大小、位置，或设置定时器等。在使用时，JavaScript允许省略window对象的名称。 window对象常用的属性和方法如表所示。 1.3 JavaScript基础 （2）Date对象 Date对象是一个有关日期和时间的对象。它具有动态性，必须使用new关键字创建一个实例，语法如下所示。 Date对象没有提供直接访问的属性，只有获取和设置日期的方法，如表所示。 1.3 JavaScript基础 （3）String对象 String对象是JavaScript提供的字符串处理对象，创建对象实例后才能引用，它提供了对字符串进行处理的属性和方法，具体如表所示： 1.3 JavaScript基础 任务案例 案例代码 接下来，通过传智书城首页的设计来熟悉本阶段的知识点，请查看教材【任务1-1】。 【任务1-1】传智书城首页设计 HTML的编辑器： 1.Notepad++ 2. HBuilder 任务案例 案例代码 接下来，通过传智书城注册页面的设计来熟悉本阶段的知识点，请查看教材【任务1-2】。 【任务1-1】传智书城首页设计 本章主要介绍了HTML技术、CSS技术和JavaScript技术的基础知识，然后使用这些技术完成阶段案例-传智书城首页和注册页面的实现。通过本章的学习，读者可以对HTML+CSS+JavaScript的基础有个大致的了解，并且能够学会这些技术在开发时如何使用。 1.4 本章小结 * * 接下来通过一个案例来演示ul/ul标记和a/a标记的使用，请查看教材文件1-8和1-9。 案例代码 1.1 HTML技术 div是英文DIVision的缩写，意为“分割、区域”。div标记简单而言就是一个区块容器标记，可以将网页分割为独立的、不同的部分，以实现网页的规划和布局。在HTML页面中，它以div开头，并以/div结尾，在div与/div之间可以容纳段落、标题、图像等各种网页元素，也就是说大多数HTML标记都可以嵌套在div标记中，并且div还可以嵌套多层div。在实际开发中div标记常常与CSS技术搭配使用，在下一小节讲解CSS技术的过程中会对div标记的使用进行举例，这里不多赘述。 div标记 1.1 HTML技术 CSS 是 Cascading Style Sheet 的缩写，译作“层叠样式表单”，是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。在实际开发中，主要用于设置HTML页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局等外观显示样式。 CSS定义的