Canvas
- 对于不支持自定义新标签的浏览器（IE9以下）的，可以使用如下方式
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<![endif]-->
- canvas绘制圆时，弧度的位置是不变的，都是从逆时针的0,0.5PI,1PI,1.5PI,2PI
SVG
-
<g>代表组 -
defs定义将来要使用的功能，<use>来调用
Communication API
-
postMessage
-
XHR2 支持跨域和进度事件
WebSocket API
基本用法
-
连接
w = new WebSocket(url, protocol); 或 w = new WebSocket(url, ["proto1", "proto2"]); -
事件
open 连接建立时 message 收到消息时 close 连接关闭时 error 错误发生时 -
发送消息
w.send(msg);
Forms
控件
- tel
- url
- search
- range
- number
- progress
- color
- datetime
- time
- week
- month
特性
- placeholder 提示
- autocomplete 自动填充
- autofocus 页面载入后，自动获取焦点
- spellcheck 检查拼写
- datalist和list 通过通过
list和datalist，用户可以构造一张选值列表 - step 指定值递增的粒度
- valueAsNumber 控件值类型与文本的转换
表单验证
获取ValidityState对象
var valCheck = document.myForm.myInput.validity;
验证
valCheck.valid;
-
valueMissing
目的：确保表单控件已填写 用法：加require -
typeMismatch
目的：保证与控件类型（email,url,number）匹配 用法：给input加type类型 -
patternMismatch
目的：保证控件的值是否为有效格式 用法：给pattern添加匹配规则 -
tooLong
用法：避免输入过多字符 用法：添加maxLength属性 -
customError
目的：自定义产生的错误信息 用法：setCustomValidity(Msg);
关闭验证
在标签添加 formnovalidate
拖动
事件
- dragstart 开始拖动时触发
- drag 拖动时触发
- dragenter 鼠标进入放置框或拖动元素时触发
- dragleave鼠标离开放置框或拖动元素时触发
- dragover 鼠标在移动时
- drop 释放鼠标是触发
- dragend 拖动的最后一个事件
设置可拖动
给标签添加可拖动属性draggable
<div id="myDragSource" draggable="true">
传输和控制
- dataTransfer 对象
Web Workers
创建
var worker = new Worker("myJS.js");
- 内联
<script id="myWorker" type="javascript/worker">
- 共享
var shareWorker = new SharedWorker("sharedWorker.js");
多个JS文件的加载和执行
importScript("file1.js", "file2.js");
会顺序加载和执行
Web Storage
cookies
生命周期由用户自己设置
localStorage
生命周期很长
sessionStorage
- 设置与获取数据
sessionStorage.setItem("myKey", "myValue");
sessionStorage.myKey = "myValue";
sessionStorage["myKey"] = "myValue";
当浏览器或者标签关闭时清除
openDatabase
IndexDB
App Cache
- manifest
<html manifest="application.appcache">
网友评论