一 html5 增加元素:
<canvas> </canvas> 用于图形绘制, 通过脚本 (常用 JS) 来完成; 具体请参考 JavaScript;
<svg> </svg> 矢量图, 支持内联;
<math> </math> 用于书写数学字符;
<video> </video> 显示视频;(支持 MP4,webM,Ogg); 内容里边需要有 sorce 标签给定的源文件; 具体请参考 JavaScript;
<audio> </audio> 显示视频;(支持 MP3,wav,Ogg); 内容里边需要有 sorce 标签给定的源文件; 具体请参考 JavaScript;
<source> 定义 media 元素 (<video> 和 <audio>)的媒体资源
<bdi> </bdi> 设置一段文本的方向, 可与父元素方向不同;
<mark> </mark> 带有记号的文本;
<time> </time> 时间; 属性有 datetime
<embed> 一个容器, 可用来嵌入部应用或插件, 属性有 width,height,src,type;
二新的元素和属性
(一)新的 < input > 标签中新增属性:
type 属性新增值:
color 颜色选择框;
date 日期选择器(部分浏览器不支持);
datetime-local 日期和时间选择器;
time 时间选择器;
week 周选择器;
email 邮件地址验证;
url url 验证;
month 月份选择;
number 数值输入, 可用以下属性进行更多限定, disabled,max,min,maxlengh,pattern(正则表达式),readonly,requried,size,step,value;
range 数值选择, 显示为一个滑块, 需用更多属性进行限定: max,min,step,value;
autofocus 不需要值, 如果给定此属性, 则在加载页面时输入域自动获得焦点;
form 设置输入域属于某一个或多个表单, 多个表单之间用空格分隔;
formaction 值会覆盖 < form > 元素中的 action 属性;
formenctype 值会覆盖 < form > 元素中的 enctype 属性;
formmethod 值会覆盖 < form > 元素中的 method 属性;
formnovalidate 值会覆盖 < form > 元素中的 novalidate 属性;
formtarget 值会覆盖 < form > 元素中的 target 属性;
height 设置 image 类型 < input > 标签高度;
width 设置 image 类型 < imput > 标签宽度;
multiple 不需要值, 如果给定此属性, 则在输入元素中可选择多个值;
pattern 值为正则表达式, 用来验证输入值;
placeholder 值为用来显示在输入域中来提示用户;
requried 不需要值, 如给定此属性, 则输入不能为空;
(二)新的表单元素:
<datalist> </datalist> 与 < input > 一起使用, 来设定预定义值, 每个值用 < option value="value">来设定;
<keygen> 提交表单时会生成私钥和公钥两个键, 私钥存于客户端, 公钥发送给服务器;
<output> 元素用于不同类型的输出, 比如计算或脚本输出.
<form>/<input > 的 autocomplete 属性, 如果值为 on 则会保留最后一次输入的值作为下次输入的默认值, 如果为 off 则不会记录保留;
<form > 的 novalidate 属性, 不需要值, 如果给定了此属性则在提交表单时不应该验证 form 或 input 域
(三)新的语义元素;
语义元素用来明确一个 Web 页面的不同部分;
<header> </header>
<nav> </nav> 定义导航链接的部分;
<section> </section> 定义文档中的节;
<article> </article> 标签定义独立的内容;
<aside> </aside> 定义页面主区域内容之外的内容;
<figcaption> </figcaption> <figure> 元素的标题, 应该被置于 "figure" 元素的第一个或最后一个子元素的位置;
<figure> </figure> 标签规定独立的流内容(图像图表照片代码等等), 元素的内容应该与主内容相关, 但如果被删除, 则不应对文档流产生影响
<footer> </footer> 描述了文档的底部区域;
(四)新的全局属性:
contenteditable 元素是否可编辑, 值有 true,false;
contextmenu 指定一个元素的上下文菜单当用户右击该元素, 出现上下文菜单, 值为要打开 < menu > 元素的 id;
data-* 存储页面的自定义数据;
draggable 元素是否可拖动, 值有 true,false,auto;
hidden
(五)新的存储方式:
localStorage 本地存储, 永久性的;
sessionStrorage 针对一个 session 进行数据存储当用户关闭浏览器窗口后, 数据会被删除;
但这两种方式的都是通过脚本来实现的;
三全局事件属性(html4 后支持, 主要用于浏览器触发事件后运行的脚本, 值都是 script):
1. 窗口事件属性
onafterprint 打印文档后运行脚本;
onbeforeprint 打印文档前;
onbeforeonload 文档加载前;
onload 文档加载时;
onoffline 文档离线时;
ononline 文档上线时;
onhaschange 文档改变时;
onredo 文档再次执行时;
onundo 文档执行撤销时;
onerror 出现错误时;
onmessage 触发消息时;
onunload 用户离开文档时;
onblur 窗口失去焦点时;
onfocus 窗口获得焦点时;
onpagehide 窗口隐藏时;
onpageshow 窗口可见时;
onpopstate 窗口历史记录改变时;
onresize 窗口大小改变时;
onstorage web storage 区域更新时;
2. 表单事件属性
onblur 元素失去焦点时;
onfocus 元素获得焦点时;
onchange 元素改变时;
oncontextmenu 触发上下文菜单时;
onformchange 表单改变时;
onforminput 表单获得用户输入里
oninput 当元素获得用户输入时;
oninvalid 元素无效时;
onselect 选取元素时;
onsubmit 提交表单时;
3. 键鼠事件属性
onkeydown 按下按键时;
onkeyup 松开按键时;
onkeypress 按下并松开按键时;
onclick 鼠标点击时;
ondblclick 鼠标双击元素时;
onmousedown 按下鼠标时;
onmouseup 松开鼠标时;
onmousemove 鼠标指针移动时;
onmouseout 鼠标指针移出元素时;
onmouseover 鼠标指针移至元素上时;
ondrag 拖动元素时;
ondraged 拖动操作结束时;
ondragstart 拖动操作开始时;
ondrop 元素正在被拖动过程中时;
ondragleave 当元素离开有效拖放目标时;
ondrageover 当元素被拖动至有效目标上方时;
onmousewheel 鼠标滚轮滚动时;
onscroll 当滚动元素的滚动条时;
4. 多媒体事件属性
onabort 发生中止事件时;
oncanplay 媒介能够开始播放, 但可能因缓冲需要停止时;
oncanplaythrough 媒介无需因缓冲而停止可播放至结尾时;
ondurationchange 媒介长度改变时;
onemptied 媒体元素突然为空时;
onended 媒体已抵达结尾时;
onerror 媒体元素加载发生错误时;
onloaddaata 加载媒体数据时;
onloadedmetadata 媒体持续时间以及其他媒体数据已加载时;
onloadstart 开始加载媒体数据时;
onpause 媒体数据暂停运行时;
onplay 媒体数据将要开始播放时;
onplaying 媒体数据正在播放时;
onprogress 当浏览器正在取媒体数据时;
onratechange 当媒体数据播放速率改变时;
onreadystatechange 就绪状态改变时;
onseeked 媒体元素定位属性不再为真且已定位结束时;
onseeking 媒体元素定位为真且定位已开始时;
onstalled 取回媒体数据过程中存在错误时;
onsuspend 浏览器已在取媒体数据但在取回整下媒体文件前停止时;
ontimeupdate 媒体改变其播放位置时;
onvolumechange 媒体音量改变时;
onwaiting 媒体已停止播放但打算继续播放时;
5. 其他
onshow <menu > 元素在上下文显示时;
ontoggle 用户打开或关闭 < details > 时;
注: 文中的新增都是在 HTML 基础上新增的
来源: http://www.bubuko.com/infodetail-2512213.html