单元一web开发概述.pdf

单元一 Web开发概述 教学目标 理解表单的构成，可以快速创建表单； 掌握表单相关标记，能够创建具有相 应功能的表单控件； 掌握表单样式的控制，能够美化表单 界面 任务1：表单标记  了解表单 能够创建表单 掌握表单的属性 表单的构成 在HTML中，一个完整的表单通常由表单控件（也称为表单元素）、提示信息和表单域3个部分构成， 如下图所示，即为一个简单的HTML表单界面及其构成。 表单域 (容纳表单控件 和提示信息) 提示信息 表单控件 (包含单行文本输入框、密 码输入框、提交按钮等) 表单的构成 对于表单构成中的表单控件、提示信息和表单域，初学者可能比较难理解，对它们的具体解释如下： • 表单控件：包含了具体的表单功能项，如单行文本输入框、密码输入框、复选框、提交按钮、重置 按钮等。 • 提示信息：一个表单中通常还需要包含一些说明性的文字，提示用户进行填写和操作。 • 表单域：它相当于一个容器，用来容纳所有的表单控件和提示信息，可以通过它定义处理表单数据 所用程序的url地址，以及数据提交到服务器的方法。如果不定义表单域，表单中的数据就无法传送 到后台服务器。 创建表单 通过认识表单，我们知道要想让表单中的数据传送给后台服务器，就必须定义表单域。在HTML中， form/form标记被用于定义表单域，即创建一个表单，以实现用户信息的收集和传递，form /form 中的所有内容都会被提交给服务器。创建表单的基本语法格式如下： form action=url地址 method=提交方式 name=表单名称 各种表单控件 /form 表单属性 • action属性 在表单收集到信息后，需要将信息传递给服务器进行处理，action属性用于指定接收并处理表单数据的 服务器程序的url地址。 例如： form action=form_action.asp 表示当提交表单时，表单数据会传送到名为form_action.asp 的页面去处理。action的属性值可以是相 对路径或绝对路径，还可以为接收数据的E-mail邮箱地址。 例如： form action=mailto:htmlcss@163.com 表示当提交表单时，表单数据会以电子邮件的形式传递出去。 表单属性 • method属性 method属性用于设置表单数据的提交方式，其取值为get或post。在HTML5中，可以通过form标记的 method属性指明表单服务器处理数据的方法，示例代码如下： form action=form_action.asp method=get 在上面的代码中，get为method属性的默认值，采用get方法，提交的数据将显示在浏览器的地址栏中， 保密性差，且有数据量的限制。而post方式的保密性好，并且无数据量的限制，所以使用method=post可 以大量的提交数据。 表单属性 • name属性 name属性用于指定表单的名称，以区分同一个页面中的多个表单。 • autocomplete属性 autocomplete属性用于指定表单是否有自动完成功能，所谓“自动完成”是指将表单控件输入的内容记 录下来，当再次输入时，会将输入的历史记录显示在一个下拉列表里，以实现自动完成输入。 autocomplete属性有2个值，对它们的解释如下： • on：表单有自动完成功能 • off ：表单无自动完成功能 表单属性