移动端touch使用

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<title>Document</title>
	<style>
	div{
	width: 200px;
	height: 200px;
	background-color: red;
	}
	</style>
	</head>
	<body>
	<!-- 移动端有特殊的触摸事件只有移动端有必须要使用模拟器调试才能触发 -->
	<div></div>
	<script>
	// 1. 有3个touch事件
	// 1. touchstart
	// 2. touchmove
	// 3. touchend
	// 和鼠标的mousemove mouseleave mouseover 有点相似
	var div = document.querySelector(\'div\');
	//手指触摸开始的时候触发的事件
	div.addEventListener(\'touchstart\', function () {
	console.log(\'touchstart\');
	});
	//手指在屏幕上移动的时候触发的事件
	div.addEventListener(\'touchmove\', function () {
	console.log(\'touchmove\');
	});
	//手指触摸结束的时候触发的事件
	div.addEventListener(\'touchend\', function () {
	console.log(\'touchend\');
	});

	</script>
	</body>
	</html>