[JS 基础] touchEvent中的changedTouches,targetTouches和touches的区别

对于移动端开发中 touchEvent(触摸事件) 中changedTouches,targetTouches和touches的区别往往不容易弄清,故特意查询了

MDN相关资料

1. 其中,对 changedTouches 的解释是

TouchList whose touch points (Touch objects) varies depending on the event type, as follows:

  • For the touchstart event, it is a list of the touch points that became active with the current event.
  • For the touchmove event, it is a list of the touch points that have changed since the last event.
  • For the touchend event, it is a list of the touch points that have been removed from the surface (that is, the set of touch points corresponding to fingers no longer touching the surface).

一个触点对象的列表,取决于事件的类型:

  • 对于 touchstart 事件,它是一个触发当前事件的触点的列表;
  • 对于 touchmove 事件,它是一个从最后一次事件对比,改变的触点的列表;
  • 对于 touchend 事件,它是已经从触摸表面移除的触点的列表(即,这些触点对应的手指不再与触摸表面接触)

2. 对 targetTouches 的解释是

TouchList listing all the Touch objects for touch points that are still in contact with the touch surface and whose touchstart event occurred inside the same target element as the current target element.

一个触发touchstart事件时触点所在元素上的所有没有离开触摸表面的触点的集合

3.对 touches 的解释是

TouchList listing all the Touch objects for touch points that are currently in contact with the touch surface, regardless of whether or not they‘ve changed or what their target element was at touchstart time.

一个不管是否改变或者目标元素是touchstart事件对应的元素的所有没有离开触摸表面触点的列表。

ps:以上中文翻译均为自己理解。

因能力有限,文章中有问题的地方,还请各路高手及时指正。

时间: 2024-10-29 19:12:11

[JS 基础] touchEvent中的changedTouches,targetTouches和touches的区别的相关文章

JAVA基础----java中E,T,?的区别

遇到<A>,<B>,<K,V>等,是用到了java中的泛型. 一般使用<T>来声明类型持有者名称,自定义泛型类时,类持有者名称可以使用T(Type) 如果是容器的元素可以使用E(Element),若键值匹配可以用K(Key)和V(Value)等, 若是<?>,则是默认是允许Object及其下的子类,也就是java的所有对象了. 所以说,如果是字每A,B,C,D...定义的,就是泛型,这里T只是名字上的意义而已T---type,E----Eleme

Java基础——java中String、StringBuffer、StringBuilder的区别

(转自:http://www.cnblogs.com/xudong-bupt/p/3961159.html) java中String.StringBuffer.StringBuilder是编程中经常使用的字符串类,他们之间的区别也是经常在面试中会问到的问题.现在总结一下,看看他们的不同与相同. 1.可变与不可变 String类中使用字符数组保存字符串,如下就是,因为有“final”修饰符,所以可以知道string对象是不可变的. private final char value[]; Strin

js基础篇——call/apply、arguments、undefined/null

a.call和apply方法详解 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象.如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj. apply方法: 语法:apply([thisObj[,ar

js删除数组中的元素

js删除数组中的元素delete和splice的区别 例如有一个数组是 :var textArr = ['a','b','c','d']; 这时我想删除这个数组中的b元素: 方法一:delete 删除数组 delete textArr[1] 结果为: ["a",undefined,"c","d"] 只是被删除的元素变成了 undefined 其他的元素的键值还是不变. 方法二:aplice 删除数组 splice(index,len,[item]

JS基础知识回顾:在HTML中使用JavaScript

想HTML页面中插入JavaScript的主要方法就是使用<script>元素. HTML4.01当中为<script>元素定义了下列6个属性: language(已废弃):原来用于表示编写代码使用的脚本语言,如JavaScript.JavaScript1.2.VBScript等,由于大多数浏览器会忽略此属性,因此就没有必要再用了: type(可选):可以看成是language的替代属性,表示编写代码使用的脚本语言的内容类型,也被称作MIME类型,在未指定此属性的情况下会被默认为t

JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象

   前   言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学,经过初步的学习,会对这一门语言有了一定深入的了解,也会感受到这一门语言的强大之处.希望各位同学通过一定的学习,会得到等大的收获. 因为是最后一篇所以内容可能有点多,希望各位同学能够慢慢看,细细看,让我们一起学习,一起进步,一起感受JS的魅力. 一函数 函数的声明及调用 1.函数的声明格式: func

js基础面试高频面点2:Javascript中undefined和not defined有什么区别?

二.Javascript中undefined和not defined有什么区别? 一句话:udefined为变量正常的数据类型,不是报错,而not defined是指变量没有定义,是报错. 那么,什么是数据类型?js中数据类型有哪些? 数据类型在数据结构中的定义是一组性质相同的值的集合以及定义在这个值集合上的一组操作的总称. js中变量的数据类型有: 值类型(基本类型):字符串(String).数字(Number).布尔(Boolean).对空(Null).未定义(Undefined).Symb

【 js 基础 】Javascript “继承”

是时候写一写 "继承"了,为什么加引号,因为当你阅读完这篇文章,你会知道,说是 继承 其实是不准确的. 一.类1.传统的面向类的语言中的类:类/继承 描述了一种代码的组织结构形式.举个例子:"汽车"可以被看作是"交通工具"的一种特例.我们可以定义一个 Vehicle 类和一个 Car 类来对这种关系进行描述.Vehicle 的定义可能包含引擎.载人能力等,也就是 所有交通工具,比如飞机.火车和汽车等都有的通用的功能描述.在对 Car 类进行定义的

js基础--javascript基础概念之语法

掌握一门语言 必须先掌握它的语法! javascript 的语法和C.Java.Perl 的语法有些相似.但是比它们更加宽松. javascript 中的一切都是严格区分大小写的.例如变量: demo 和 Demo 两个变量是完全不同的. javascript 标示符,所谓标示符 是指 变量.函数.属性 的名字或函数的参数.标示符的格式是按照以下规则组合的一个或多个字符. 1.第一个字符必须是字母,下划线,或 $ 符号. 2.其他字符可以是字母.下划线.$ . 或数字. 注意 不能把关键字 保留