HTML5API(5)

一、SVG

1、svg与canvas的区别

• canvas绘制的是位图，svg绘制的是矢量图
• canvas使用JavaScript绘制，svg使用xml绘制
• canvas不能给每个图形绑定事件，svg可以给每个图形绑定事件
• canvas适合游戏等频繁操作的应用，svg适合图标
• canvas需要支持H5标准的浏览器，svg的兼容到IE6
  

2、在html中使用svg

• <embed引入>

• <object>引入

• <iframe>引入

• 直接嵌入

3、svg绘制图形

• 参考教程 http://www.runoob.com/svg/svg-tutorial.html

二、触摸屏事件

1、事件类型

• touchstart 开始触摸
• touchmove 触摸移动
• touchend 结束触摸

2、touchEvent对象

• touches
  

  
  
  
  
  
  
  
  
  
  
  
  
  

3、touchList对象

4、touch对象

• clientX
• clientY
• pageX
• pageY
• scrollX
• scrollY
  

三、事件类型

鼠标事件

键盘事件

文档事件

图片事件

表单事件

其他事件

四、H5新增事件类型

1、拖放事件 dragEvent

2、多媒体事件 mediaEvent

3、progress progerssEvent

4、触摸屏事件 touchEvent

5、window事件

6、Form事件

7、Mouse事件

8、其他事件