form表单:
form表单里的标签有:input,(输入框,这里是要有属性的) select(下拉菜单) option(嵌套在select标签里的,这个是表示下拉菜单里的选项) textarea(表示多行文本框) label(label标签是与input产生联系的) method(提交方式) action(提交地址) placeholder(input中的提示信息,下面会有placeholder与value的区别。)
input:
input是有一个type属性的以及还有很多属性接下来先对常见type的值做一个介绍。(下面会对input标签里的其他属性做简介)
- text 单行文本框(注意这个是单行文本框并且还是input里type属性的值。多行文本框是一个标签)
- password 密码域(这个会将输入将输入的文本用粗黑点表示)
- checkbox 复选框
- radio 单选框
- file 文件域(file后面是要有name的在file中name是只读的)
- name 数据的名字(相当于给数据写名字)
- value 提交数据(如果给了一个value还给了属性值那么这个属性值会默认的出现在input中的。如果要将input中的数据提交要有一个那么name)
- button 提交按钮(这个要配合js使用)
- submint 提交按钮(为保险起见不同浏览器编译出的不同在写这个属性是后面要加value属性)
- reset 重置按钮((为保险起见不同浏览器编译出的不同在写这个属性是后面要加value属性)
- image 图像域(会将form表单的数据进行点击图片提交,同时会将鼠标的坐标进行提交,这个的作用主要就是可以把一张图片当成一个提交按钮)
- hideden 隐藏域(常用场景:不想让用户看到的地方使用。主要作用是将input隐藏)
select:
select标签里有两个属性name和size
- name 起名字的作用
- size &nbnsp;想让列表出现几个选项属性值就填几
option
option也有两个属性value和selected
- value 属性是在option选项中写的,value的值适合后台商量好的值。
- selected 默认选择到选项
textarea
这里就不做介绍只写个例子:<textarea name="" cols="" rows="">(cols是复选框的高row是复选框的高)
label
label是与input产生联系的,label标签有一个属性for例如:<label for="id">(如果input在label中有多个那么只与第一格input产生绑定)
label标签的两种写法:
直接将input写在label中,注意只与第一个input绑定 可以将label和input分开写要给input增加一个id属性,利用label中的for属性method:
method是用作提交方式的,提交方式有两种:get和post。get的常用场景是分享和收藏,post的常用场景是 登陆。
get和post的区别:get会将数据直接显示在URL中post不会将数据直接提交在URL中。
action:
action主要用来显示数据提交的地址,如果没有给action值那么会提交到当前页面。
placeholder:
placeholder主要是input中的提示信息,这个和value不同当input获取到焦点的时候这个会自动消失。
value和placedolder的区别:
paceholder当文本框获取到焦点placedolder会自动消失当输入框是空白的时候placeholder会自动出现。value是要传输的数据如果给了vluae属性那么这个属性会自动的出现在文本框中除非在文本框中删除。