touch事件有哪些，它的三个列表有什么区别

touch事件是指用户在触摸屏幕时所触发的事件，主要包括以下几种：

1. touchstart：手指触摸屏幕时触发；
2. touchmove：手指在屏幕上滑动时触发；
3. touchend：手指从屏幕上移开时触发；
4. touchcancel：系统取消touch事件的时候触发，例如：手指触摸屏幕后，突然来了一个电话，此时系统会取消当前的touch事件。

touch事件的三个列表分别是：

1. touches：记录当前屏幕上所有触摸点的信息；
2. targetTouches：记录当前事件目标元素上的所有触摸点的信息；
3. changedTouches：记录当前事件触发时涉及到的所有触摸点的信息。

这三个列表的区别在于记录的触摸点信息不同。touches记录所有的触摸点信息，targetTouches记录当前事件目标元素上的触摸点信息，而changedTouches只记录当前事件涉及的触摸点信息。

相关问题

实现移动端touch事件的横向滑动列表效果并循环展示

实现移动端touch事件的横向滑动列表效果并循环展示的一种常见方法是使用CSS3的transform属性和JavaScript的Touch事件。

首先，创建一个容器 div，设置其宽度为视口宽度的倍数，如 300%。在容器内部创建多个 div 元素，分别放置需要展示的内容。

然后，通过CSS3的transform属性将容器的位置移动到第二个或第三个 div 元素的位置，使得第一个 div 元素在视口外不可见。

接下来，使用JavaScript监听Touch事件，根据手指在屏幕上的移动距离，通过改变容器的transform属性来实现横向滑动效果。同时，当容器滑动到最后一个 div 元素时，将其位置移动到第一个 div 元素的位置，实现循环展示的效果。

下面是一个实现横向循环滑动列表效果的示例代码：

HTML：

<div class="container">
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="item">3</div>
</div>

CSS：

.container {
  width: 300%;
  display: flex;
  transition: transform 0.3s ease-in-out;
}

.item {
  flex-basis: calc(100% / 3);
  text-align: center;
  font-size: 30px;
}

JavaScript：

var container = document.querySelector('.container');
var startX, startY, moveX, moveY, distanceX, distanceY;

container.addEventListener('touchstart', function(e) {
  startX = e.touches[0].clientX;
  startY = e.touches[0].clientY;
});

container.addEventListener('touchmove', function(e) {
  moveX = e.touches[0].clientX;
  moveY = e.touches[0].clientY;
  distanceX = moveX - startX;
  distanceY = moveY - startY;

  if (Math.abs(distanceX) > Math.abs(distanceY)) {
    e.preventDefault();
    container.style.transform = 'translateX(' + (-100 / 3 + distanceX / window.innerWidth * 100) + '%)';
  }
});

container.addEventListener('touchend', function(e) {
  if (distanceX > 0 && Math.abs(distanceX) > window.innerWidth / 5) {
    container.style.transform = 'translateX(' + (-200 / 3) + '%)';
  } else if (distanceX < 0 && Math.abs(distanceX) > window.innerWidth / 5) {
    container.style.transform = 'translateX(' + '0' + '%)';
  } else {
    container.style.transform = 'translateX(' + (-100 / 3) + '%)';
  }
});

container.addEventListener('transitionend', function() {
  if (container.style.transform === 'translateX(' + (-200 / 3) + '%)') {
    container.style.transition = 'none';
    container.style.transform = 'translateX(' + (-100 / 3) + '%)';
    setTimeout(function() {
      container.style.transition = 'transform 0.3s ease-in-out';
    }, 0);
  } else if (container.style.transform === 'translateX(' + '0' + '%)') {
    container.style.transition = 'none';
    container.style.transform = 'translateX(' + (-100 / 3 * 2) + '%)';
    setTimeout(function() {
      container.style.transition = 'transform 0.3s ease-in-out';
    }, 0);
  }
});

在这个示例中，我们使用了Flex布局和CSS3的calc()函数来创建了一个横向排列的列表。Touch事件监听了用户的滑动操作，通过改变容器的transform属性来实现横向滑动效果。当滑动到最后一个 div 元素时，通过修改transform属性实现循环展示的效果。同时，我们还添加了一些防抖和节流的优化，使得滑动效果更加流畅。

用shell脚本用touch 命令创建三个文件

好的，您可以使用以下Shell脚本来创建三个文件：

#!/bin/bash
touch file1.txt
touch file2.txt
touch file3.txt

将上述代码保存为一个.sh文件，然后在终端中使用以下命令运行该脚本：

chmod +x script.sh
./script.sh

这将创建三个空文件：file1.txt，file2.txt和file3.txt。