JavaScript 코드 시 뮬 레이 션 마우스 자동 클릭 이벤트 예시

자 바스 크 립 트 코드 를 이용 하면 마우스 의 자동 클릭 이 벤트 를 실현 하 는 데 도움 을 줄 수 있 습 니 다.예 를 들 어 버튼 1 을 누 르 면 자바 스 크 립 트 코드 는 자동 으로 다음 단 추 를 누 르 고 버튼 5 를 눌 러 야 정지 합 니 다(실제 상황 에 따라 조정 할 수 있 습 니 다).
효과 도 는 다음 과 같다.

버튼 1 이 클릭 되면 자 바스 크 립 트 코드 를 통 해 버튼 2 를 자동 으로 클릭 하고 코드 가 버튼 2 를 클릭 하면 버튼 3 을 클릭 합 니 다.이 를 통 해 버튼 5 를 클릭 할 때 까지 유추 합 니 다.

먼저 몇 개의 단 추 를 설정 한 다음 에 상자 에 문 자 를 감 싸 서 다음 js 부분 에서 안의 내용 을 바 꿀 때 그 효 과 를 더욱 직관 적 으로 볼 수 있 도록 한다.
HTML 코드 부분:

css 를 통 해 이 단 추 를 통 해 너비,높이,테두리 의 스타일 을 설정 하고 페이지 의 한가운데 위 에 표시 한 다음 에 키 프레임(@keyframes,브 라 우 저 호환성 문 제 를 고려 하여 키 프레임 앞 에 서로 다른 접 두 사 를 추가 할 수 있 습 니 다)을 사용 하여 이 문자 들 에 크기,굵기 효 과 를 설정 하고 색상 의 변 화 를 추가 할 수 있 습 니 다.글 자 를 사라 지 는 것 부터 숨 기 는 것,사라 지 는 것 까지 의 과정 이 있다.
CSS 부분 코드:

js 부분의 코드 는 HTML 페이지 에 쓸 수도 있 고 js 파일 을 자체 적 으로 만 들 수도 있 습 니 다.만 든 후에 페이지 로 딩 이 벤트 를 작성 할 수 있 습 니 다.그리고 ID 를 통 해 앞의 HTML 스타일 을 얻 은 다음 에 버튼 1 에 클릭 이 벤트 를 추가 하고 클릭 이벤트 에 클릭 이 벤트 를 삽입 할 수 있 습 니 다.주의:클릭 이벤트 가 너무 빨리 클릭 하지 않도록타이머 setTimeout 을 이용 하여 클릭 이벤트 가 얼마나 걸 려 야 트리거 되 는 지 설정 할 수 있 으 며,변 수 를 설정 한 후 타이머 에 값 을 부여 할 수 있 습 니 다(e=setTimeout...).마지막 으로 innerHtml 을 통 해 HTML 의 문 자 를 바 꾸 면 버튼 전환 효 과 를 더욱 직관 적 으로 볼 수 있다.
JavaScript 코드 부분:

자 바스 크 립 트 코드 시 뮬 레이 션 마우스 자동 클릭 이벤트 예시 에 관 한 이 글 은 여기까지 소개 되 었 습 니 다.자 바스 크 립 트 시 뮬 레이 션 마우스 자동 클릭 이벤트 내용 은 이전 글 을 검색 하거나 아래 의 관련 글 을 계속 찾 아 보 세 요.앞으로 많은 응원 부탁드립니다!