第四章表单与文件-笔记-验证
自动验证
required属性 html5中新增的这个属性可以应用在大多数的输入元素上
pattern属性 其值为正则表达式
min属性和max属性
step属性
显示验证
在html5中,form元素与input元素都具有一个checkValidity方法。调用该方法。 可以显式地对表单内所有元素内容或单个元素进行有效性的验证,checkValidity以boolean的形式返回验证结果。
************************************* 火狐 chrome oprea 都可以
取消验证
第一种方法:利用form元素的novalidate属性,他可以关闭整个表单的验证,先把该属性设置为true,关闭表单验证,提交第一部分内容然后在提交第二部分时把它设为false,并打开表单验证,提交第二部分内容。
第二种方法:利用input元素或submit元素的formnovalidate属性,利用formnovalidate属性可以让表单验证对单个input元素失效、
利用这一点,可以实现 假提交 与 真提交 的效果
自定义错误信息
在js中调用各个input元素的setCustomValidity方法来自定义错误信息。
*************************************书本上说可以在oprea中使用。但是在我电脑上这个参数不几个浏览器都不能使用。
增强的页面元素
figure元素
他与figcaption元素是一种元素组合,他主要用来表示网页上一块独立的内容,将其从网页上移除后不会对网页上的其他内容产生任何影响。他所表示的内容可以是图片,统计图或代码示例。
figcaption元素表示figure元素的标题,他从属于figure元素,必须书写在figure元素内部,可以书写在figure元素内的其他从属元素的前面或后面。一个figure元素内最多只允许放置一个figcaption元素,但允许放置多个其他元素。
*************************************支持:opera chrome3 firefox4
details元素
提供了一种替代javascript的,将画面上局部区域进行展开或收缩的方法。
他又一个属性open如果为他添加open属性的话。他默认情况时展开的。
************************************* 支持chrome
mark元素
表示页面中需要突出显示或者高亮显示的,对于当前用户具有参考作用的文字。
mark元素对原文内容具有补充作用的一个元素。他应该用于一段原文作者不认为重要,但为了与原文作者不相关的其他目的而需要突出显示或者高亮显示的文字上面
能够体现mark元素作用最好的例子是对网页全文检索某个关键词时显示的检索结果,在许多搜索引擎用其他方法实现了mark元素所要达到的功能。
他的另一个作用是引用原文的时候,为了某种特殊目的而把原文作者没有特别重点标示的内容标示出来。
使用mark包裹的标签默认情况会有黄色的背景
强调:html4中,是使用em或者strong元素来突出显示文字,他与mark元素的
区别:mark元素表示目的与原文作者无关,或者说他不是原文作何用来表示文字的,而是后来加上去的,他的目的是吸引当前用户的注意力,提供给用户作参考。
*************************************oprea chrome firefox IE 9 10
progress元素
代表一个任务的完成进度,这个进度可以是不确定的。
该元素具有两个属性表示当前任务完成情况,value属性表示已经完成了多少,max属性表示总共有多少工作量。工作量的单位是随意的,不用指定。
在属性设定的时候,value属性和max属性只能指定为有效的浮点数,value的值必须大于0且小于max属性。而max的值必须大于0
*************************************支持chrome firefox
meter元素
表示规定范围内的数值量:例如磁盘使用量,对某个候选者的投票人数占投票人数的比例。
他有六个属性 value:在元素中特地表示出来的实际值,默认为0 。 min:指定规定的范围时允许使用的最小值。默认为0 max指定规定的范围时允许使用的最大值默认为1
low:规定范围的下限值。必须小于等于high属性同样如果low值小于min属性的值,那么把min 属性的值视为low属性的值。
high:规定范围的上限值,如果他属性值小于low属性的值,那么吧low属性点值视为high。同样的。如果该属性值大于max值。那么吧max属性的值视为high属性的值。
optimum:最佳值:必须在min属性值与max属性值之间,可以大于high属性的值
*************************************这个参数在chrome oprea firefox中都可以用但是书本上说的对ie加<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>可以使用。经过实际操作 不能使用。
改良ol列表
在html5中,将ol列表进行改良,对它添加了start属性和reversed属性。
如果不想ol元素所代表的列表编号从1开始,那么可以使用start属性来定义编号的初始值。
*************************************start属性所有浏览器都支持。但是reversed属性非ie的浏览器支持。
改良dl列表
html4中,dl元素是一个专门用来定义术语的列表。 html5中,将该元素进行重新的定义,重新定义后的dl列表包含多个带名字的列表项。一项包含一条或多条带名字的dt元素,用来表示术语,dt元素后面紧跟一个或多个dd元素,用来表示定义。在一个元素内,不允许有相同名字的dt元素,不允许有重复的术语。
cite元素
cite元素表示作品的标题,在html4中,cite元素可以用来表示作者,但在html5中明确规定了不能用cite元素表示包括作者在内的任何人名,