表单基本上就是带有一块输入信息区域的网页。当提交表单时,表单中的信息被打成一个数据包发送给web服务器,web应用程序对之经行处理。处理完成后,可以获得另一个相应页面。
使用<form>元素创建一个表单,任何元素块级别的元素都可以构成<form>元素。<form action="http://www.headfirstlabs.com/contest.php" method="POST">action属性说明了web服务器的url和处理表单数据的web应用程序。method属性制定了表单以何种方式给服务器发送数据。
<input>属性能够演变为网页中许多不同的input控件,主要取决于type的属性,<input>元素是空元素。type为text,创建一个单行文本输入框,<input type:"text" name="fullname" />。type为submit,创建一个提交按钮,<input type="submit" />。type为radio,创建一个单选框按钮,所有单选框按钮名字相同,这些单选框组成一个互助互斥的按钮组<input type="radio" name="hotornot" value="hot" />。type为checkbox,创建一个复选框控件,多个复选框共享一个复选框名字,并得到一组选项<input type="checkbox" name="spice" value="salt" />。
<texyarea>元素创建一个可输入多行文本的文本框,<textarea>不是一个空元素。<textarea name="comments" rows="10" cols="48"></textarea>rows属性设置文本区的高度,cols设置文本区的宽度。
<option>元素和<select>元素共同创建一个菜单,<option>元素定义每个菜单选项。
<select name="characters">
<option value="Buckroo">Buckaroo Banzai</option>
<option value="Tommy">Perfect Tommy</option>
</select>
将<input>元素的checked属性设置为checked,那么浏览器在显示表单时,这个选项就会被默认为已选状态。
在名字的末端添加一个方括号,按时了一个表单变量可以拥有多个值。
POST把表单变量打包后隐藏在后台发送给服务器。GET也把表单变量打包,不过在它向浏览器发送请求之前,附加在URL的末端部分。希望用户能够标记返回结果时,用GET方式。
大多数表单在布局上是表格式的。
<fieldset>元素用来组合普通元素,<legend>为每个组合提供一个标签。
<lable>元素可以给表单元素附加标签。