表单练习
我们写完代码，要有测试代码的习惯：
下面我们检验"清空"按钮：
如图所示：
没问题。
再来检验一下“注册”按钮
https://www.jianshu.com/?zhouxingzhi=zhou&123456=123&sex=on&aihao=on&aihao=on&cc=555
我们需要进一步完善代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单</title>
</head>
<body>
<form action="https://www.jianshu.com/">
<p>账号：<input type="text" name="zhouxingzhi"/></p>
<p>密码：<input type="password" name="123456"/></p>
<p>性别：
<input type="radio" name="sex"/>男
<input type="radio" name="sex"/>女
<input type="radio" name="sex" checked="checked"/>保密
</p>
<p>爱好：
<input type="checkbox" name="aihao"/>篮球
<input type="checkbox" name="aihao"/>读书
<input type="checkbox" name="aihao" checked="checked"/>配音秀
</p>
<p>
简介：
<textarea cols="30" rows="10" name="text"></textarea>
</p>
<p>
生日：<input type="date" name="day"/>
</p>
<p>
邮箱：<input type="email" name="email"/>
</p>
<p>
手机：<input type="number" name="phone"/>
</p>
<input type="submit" value="注册"/> <input type="reset" value="清空"/>
<input type="hidden" name="cc" value="555"/>
</form>
</body>
</html>
运行结果如图所示：
最后分解一下地址栏的数据：
https://www.jianshu.com/?
账号部分
zhouxingzhi=zhouxingzhi&
密码部分
123456=1223&
性别部分
sex=on&（疑问）
爱好部分
aihao=on&（疑问）
aihao=on&（疑问）
个人简介部分
text=just++do+it&
生日部分
day=2004-12-01&
邮箱部分
email=134%40qq.com&
电话部分
phone=15213282306&cc=555
进一步优化代码，给性别部分和爱好部分加上value属性：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单</title>
</head>
<body>
<form action="https://www.jianshu.com/">
<p>账号：<input type="text" name="zhouxingzhi"/></p>
<p>密码：<input type="password" name="123456"/></p>
<p>性别：
<input type="radio" value="boy"name="sex"/>男
<input type="radio"value="girl" name="sex"/>女
<input type="radio" value="secret"name="sex" checked="checked"/>保密
</p>
<p>爱好：
<input type="checkbox"name="aihao" value="basketball"/>篮球
<input type="checkbox" name="aihao"value="read"/>读书
<input type="checkbox"name="aihao" value="movie dubbing" checked="checked"/>配音秀
</p>
<p>
简介：
<textarea cols="30" rows="10" name="text"></textarea>
</p>
<p>
生日：<input type="date" name="day"/>
</p>
<p>
邮箱：<input type="email" name="email"/>
</p>
<p>
手机：<input type="number" name="phone"/>
</p>
<input type="submit" value="注册"/> <input type="reset" value="清空"/>
<input type="hidden" name="cc" value="555"/>
</form>
</body>
</html>
运行我们看一下地址栏：
地址栏：
https://www.jianshu.com/?zhouxingzhi=zhouxingzhi&
123456=123&
sex=boy&
aihao=basketball&
aihao=movie+dubbing&
text=just+++do+++it&
day=2014-12-31&
email=134%40qq.com&
phone=12345677890&cc=555
