## 前言 也许你对标签属性的知识局限于style,class,id，作为技术纵深，这些事远远不够的。 ## h5全局属性（16个） accesskey class contenteditable contextmenu dir draggable dropzone hidden id lang style tabindex title spellcheck data-* translate ### h5新增全局属性（8个） contenteditable: true false 定义元素内容是否可编辑，默认false contextmenu: menu_id 定义元素的上下文菜单，属性值是该菜单的id属性,默认false draggable: true false auto 定义元素是否可拖拽,默认false dropzone: copy move link 定义元素被拖拽时是复制数据、移动元素、产生指向原数据的连接 hidden: hidden 定义元素是否隐藏, spellcheck: true false 定义是否对元素进行拼写或语法检查,,默认false data-*: 自定义 存储页面或应用程序的私有自定义属性 translate: yes no 定义元素是否应该被翻译,默认no ### 自定义属性 * 首先，需要明确的是标签中支持自定义属性，但是一些特定的属性是有特定含义的，例如以下几种： class,style 属于样式修饰的； id,name,可以做标识的，title 做描述的 value ,data- 做值域的 readonly,disabled,selected,checked等用来区分元素的状态属性 oninput,onchange,onblur 用于事件属性的， src 用于标签需要的源文件 href ,target,用于关联信息以及连接效果 type,多用于表单的输入类型 placeholder,pattern用于辅助输入，表单提示输入的 所以，除了以上的几种，就可以自定义属性，用于做标识，做自定义数据，做标签类型等，需要注意的是属性不区分字母的大小写。 * input type新增的属性：可以支持更好的数据验证 * email 邮箱验证 * url 网络地址 * number 数字，手机端调用输入法的数字键盘 * range 范围 * Date pickers (date, month, week, time, datetime, datetime-local)，日期 * search * color 颜色 * tel 电话，手机端会调用手机系统数字键盘 ## 事件属性 * 事件属性多用于用户的交互体验，超出1/2是h5新增的，下面摘抄出常用的作为知识储备。 1. window事件： onload()，另外补充h5新增的事件。 onbeforeprint,onafterprint,打印前后触发的事件 onerror 发生错误的时候 onhaschange 文档发生改变的时候 ononline onoffline 文档上线下线的脚本 onpagehide onpageshow 用于窗口隐藏和显示 onresize 窗体大小发生改变时 onunload 一旦页面已下载或者窗口关闭 onbeforeunload 文档呗卸载前 2. form事件： onblur() onchange() onfocus() onselect() onsubmit()，onreset(),新增的事件有： oncontextmenu 上下文的菜单触发 onformchange 表单改变时 onforminput 表单获得用户的输入状态时 oninput 元素获得用户的输入状态时 oninvalid 元素无效的时候使用 其中oninput 是目前应用很多的事件，可以用于输入的实时内容类型验证，避免非法字符的输入 3. keyboard事件 : onkeypress()敲击 onkeydown()按下 onkeyup()释放 这三个均属于新增的事件 4. mouse事件：onclick() ondbclick() onmousedown() onmousemove() onmouseover() onnouseout() onmouseup() ondrag 一系列的针对事件，包括拖动触发，拖动开始结束触发，拖到进入以及离开有效区域的， onmousewheel 鼠标滚动 onscroll 元素内的滚动呗触发 5. media事件： onplay() onpause()，有兴趣的可以查看官网w3c的介绍。