터치 이벤트 구문 분석 및 캡슐화에 대한 지식

터치 이벤트 분석

1. touchstart 이벤트: 이미 화면에 손가락이 있더라도 손가락이 화면을 터치하면 트리거됩니다.

2. touchmove 이벤트: 손가락이 화면을 슬라이드할 때 지속적으로 트리거됩니다. 이 이벤트 중에 PreventDefault() 이벤트를 호출하면 스크롤을 방지할 수 있습니다.

3. touchend event: 손가락이 화면에서 벗어날 때 트리거됩니다.

4. touchcancel event: 시스템이 터치 추적을 중지할 때 트리거됩니다. 이번 행사의 정확한 출발 시간에 대해서는 문서에 구체적인 설명이 없기 때문에 추측만 할 수 있을 뿐입니다.

위 이벤트는 버블티가 발생하여 모두 취소될 수 있습니다. 이러한 터치 이벤트는 DOM 사양에 정의되어 있지 않지만 DOM 호환 방식으로 구현됩니다. 따라서 각 터치 이벤트의 이벤트 객체는 마우스 연습에서 다음과 같은 공통 속성을 제공합니다. 이벤트가 발생하면 마우스 포인터의 가로 좌표), clientY(이벤트가 발생하면 마우스 포인터의 세로 좌표를 반환), screenX(이벤트가 발생하면 마우스 포인터의 가로 좌표) 및 screenY( 이벤트가 트리거될 때 반환) 이벤트가 트리거될 때 마우스 포인터의 수직 좌표). 일반적인 DOM 속성 외에도 터치 이벤트에는 터치 추적을 위한 다음 세 가지 속성도 포함되어 있습니다.

• touches: 현재 추적되는 터치 작업을 나타내는 터치 개체 배열입니다.

• targetTouches: 현재 요소에 대한 이벤트를 트리거하는 Touch 개체의 배열입니다.

• changeTouches: 마지막 터치 이후 변경된 내용을 나타내는 Touch 개체의 배열입니다.

각 Touch 개체에 포함된 속성은 다음과 같습니다.

　clientX: 뷰포트에 있는 터치 대상의 x 좌표입니다.

　clientY: 뷰포트에 있는 터치 대상의 y 좌표입니다.

　identifier: 터치를 식별하는 고유 ID입니다.

　pageX: 페이지 내 터치 대상의 x 좌표입니다.

　pageY: 페이지 내 터치 대상의 y 좌표입니다.

　screenX: 화면 내 터치 대상의 x 좌표입니다.

　screenY: 화면 내 터치 대상의 y 좌표입니다.

　target: 눈길을 끄는 DOM 노드 타겟.

위 내용은 터치 이벤트 구문 분석 및 캡슐화에 대한 지식의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!