一、觸摸事件
ontouchstart、ontouchmove、ontouchend、ontouchcancel
目前移動端瀏覽器均支持這4個觸摸事件，包括IE。由於觸屏也支持MouseEvent，因此他們的順序是需要注意的：touchstart → mouseover → mousemove → mousedown → mouseup → click1
Apple在iOS 2.0中引入了觸摸事件API，Android正迎頭趕上這一事實標准，縮小差距。最近一個W3C工作組正合力制定這一觸摸事件規范。
二、規范
這里我們介紹幾種普及得比較好的觸摸事件，你可以在絕大多數現代瀏覽器中來測試這一事件（必須是觸屏設備哦）：
touchstart：觸摸開始的時候觸發
touchmove：手指在屏幕上滑動的時候觸發
touchend：觸摸結束的時候觸發
而每個觸摸事件都包括了三個觸摸列表，每個列表里包含了對應的一系列觸摸點（用來實現多點觸控）：
touches：當前位於屏幕上的所有手指的列表。
targetTouches：位於當前DOM元素上手指的列表。
changedTouches：涉及當前事件手指的列表。
每個觸摸點由包含了如下觸摸信息（常用）：
identifier：一個數值，唯一標識觸摸會話（touch session）中的當前手指。一般為從0開始的流水號（android4.1，uc）
target：DOM元素，是動作所針對的目標。
pageX/pageX/clientX/clientY/screenX/screenY：一個數值，動作在屏幕上發生的位置（page包含滾動距離,client不包含滾動距離，screen則以屏幕為基准）。
radiusX/radiusY/rotationAngle：畫出大約相當於手指形狀的橢圓形，分別為橢圓形的兩個半徑和旋轉角度。初步測試瀏覽器不支持，好在功能不常用，歡迎大家反饋。
有了這些信息，我們就可以依據這些事件信息為用戶提供不同的反饋了。
下面，我將為大家展示一個小demo，用touchmove實現的單指拖動:
/**
* onTouchEvent
*/
var div = document.getElementById("div");
//touchstart類似mousedown
div.ontouchstart = function(e){
//事件的touches屬性是一個數組，其中一個元素代表同一時刻的一個觸控點，從而可以通過touches獲取多點觸控的每個觸控點
//由於我們只有一點觸控，所以直接指向[0]
var touch = e.touches[0];
//獲取當前觸控點的坐標，等同於MouseEvent事件的clientX/clientY
var x = touch.clientX;
var y = touch.clientY;
};
//touchmove類似mousemove
div.ontouchmove = function(e){
//可為touchstart、touchmove事件加上preventDefault從而阻止觸摸時瀏覽器的縮放、滾動條滾動等
e.preventDefault();
};
//touchend類似mouseup
div.ontouchup = function(e){
//nothing to do
};
三、手勢事件
手勢是指利用多點觸控進行旋轉、拉伸等操作，例如圖片、網頁的放大、旋轉。需要兩個或以上的手指同時觸摸時才會觸發手勢事件。關於縮放我們需要注意的一點 是元素的位置坐標：我們通常使用offsetX、getBoundingClientRect等方法獲取元素的位置坐標，但在手機瀏覽器中頁面經常會在使 用中被縮放，那縮放后的元素坐標會改變嗎？答案是有所差異。用一個情景來說明這個問題：頁面A加載完成后，JavaScript獲 取到該元素在document中的坐標為(100,100)，接着用戶放大了頁面，此時用JavaScript再次輸出元素坐標，依然還是 (100,100)，但該元素在屏幕上的響應區域會根據縮放比例產生偏移。你可以打開那個打磚塊游戲demo，等頁面完全加載完成后，再放大，此時你會發 現即使手指觸摸在“touch here”區域外部，也可以控制到球板，因為區域發生了偏移。除非頁面刷新或者恢復縮放，否則偏移量將一直存在。
/**
* onGestureEvent
*/
var div = document.getElementById("div");
div.ongesturechange = function(e){
//scale代表手勢產生的縮放比例，小於1是縮小，大於1是放大，原始為1
var scale = e.scale;
//rotation代表旋轉手勢的角度，值區間[0,360]，正值順時針旋轉，負值逆時針
var angle = e.rotation;
};
四、重力感應
重力感應較簡單，只需要為body節點添加onorientationchange事件即可。在此事件中由window.orientation屬性得到代表當前手機方向的數值。window.orientation的值列表如下：
0：與頁面首次加載時的方向一致
-90：相對原始方向順時針轉了90°
180：轉了180°
90：逆時針轉了90°據我測試，Android2.1尚未支持重力感應。以上即目前的觸屏事件，這些事件尚未並入標准，但已被廣泛使用。本人Android2.1，未在其他環境下測試。