html表单元素

感觉表单元素的内容很多,也很杂乱,虽然常用的也就那么几个,但最好还是都了解一下。免得到时候心慌。多一种方法,毕竟也是多一种出路嘛。自己整理了一下子。

1. 表单的作用

收集不同类型的用户的输入

表单元素,用form标签所包围

2. 表单元素

1)input元素 
这个元素有很多的属性,根据type的取值的不同 

text :常规的文本的输入 
radio:单选按钮 
submi:提交按钮 
button:提交按钮 
password:输入密码 
checkbox:复选按钮 

2)select元素 
这个元素表示的是复选框

<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>

3)textarea元素 
这个元素表示的就是文本输入框,定义多行的文本输入域 
4)button 元素 
这个元素和input标签的submit和button是存在这差别的,具体的差别呢,我们会在另一个篇幅来介绍的。这个元素也表示表单的提交。 

 (button元素可以嵌套。但是input元素的提交按钮不能够嵌套,如果你想做那种有漂亮的背景的提交按钮,只能够选择button。比如说,图文混排的效果

    <button><img src="">我是按钮,但是我可以插入图片</button> 

    <input type="submit" value="我是按钮,但是我不可以插入图片的"><img src=""> 

  当input表单的type属性为 submit 的时候,是可以直接的讲用户输入的内容提交到你需要处理的页面的,这个时候不需要借用其他的js的操作

   如果你使用 input 的 type 属性为  button 。或者是直接使用button 表单元素的方式的话,是必须要自己添加js的代码。才能完成相应的提交功能的

  )

5)HTML5新增的表单元素

<datalist>
<keygen>
<output>

以上只是大致的内容,具体请参阅文档 
http://www.w3school.com.cn/html/html_forms.asp

原文地址:https://www.cnblogs.com/yiyistar/p/6758389.html