表单
<form>标签、action属性、method属性
HTML表单用于搜集用户输入,<form>标签用于创建表单。并用action属性规定提交表单的时候,往何处发送数据。method则决定提交表单的方法:get或post,若没有指明,则默认为get。
<form action="https://www.baidu.com/s" method="get">
</form>
name属性
name 属性指定表单的名称。
要接收用户输入,你需要相应的表单元素,如文本字段。而输入类型是由类型属性(type)定义的,大多数经常被用到的输入类型有:text,password,radio,checkbox,submit 等。
<form>
id:<input type="text" name="username" /><br />
ps:<input type="password" name="password" />
</form>
单选框、复选框、提交按钮
两个框都是由input 赋予属性实现的,value是用于表单提交的值。
<input type=”radio”> 标签定义了表单单选框选项。
<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>
<input type=”checkbox”> 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>
提交按钮
提交按钮将表单提交到其 action 属性
<input type="submit" value="显示文字" />
百度搜索框实例
<form action="https://www.baidu.com/s" method="get">
<input type="text" name="wd" value="hello baidu">
<input type="submit" value="百度一下">
</form>
这边就需要提一下GET,GET请求的数据会附在URL之后(就是把数据放置在HTTP协议头中),以?分割URL和传输数据,参数之间以&相连。
上面所列出的代码中,name为 wd ,value为 hello baidu,则发送的数据为
https://www.baidu.com/baidu?wd=hello+baidu
明显可以看出,为action?name=value的格式
这个网址是如何找到的呢?学到现在有了一点HTML基础,可以打开www.baidu.com,按下F12,则可以查看当前网页的源代码。
以下是百度搜索页面表单部分
可以看到action = “/s”,即会在当前网址最后加上 /s,则变成了https://www.baidu.com/s