웹 프론트엔드 JS 튜토리얼 js 버블링 이벤트 및 이벤트 청취 사용 분석_javascript 기술

js 버블링 이벤트 및 이벤트 청취 사용 분석_javascript 기술

May 16, 2016 pm 06:45 PM
이벤트 청취 버블링 이벤트

버블 이벤트
js의 "버블 이벤트(bubble)"는 실제로 사용할 수 있는 화려한 트릭이 아닙니다. js 이벤트의 순서를 실행하는 메커니즘입니다. "버블 알고리즘"은 프로그래밍의 고전적인 문제입니다. 버블 알고리즘의 "버블"은 더 정확하게 교환한다고 말해야 합니다. js의 "버블 이벤트"는 "버블"의 진정한 의미입니다. DOM의 가장 낮은 수준에서 레이어별로 트리를 통과한 다음 연결됩니다. 해당 이벤트. 다음 코드를 예로 들어 보겠습니다.


[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.
]

보기 실행 효과
이벤트 모니터링
정확히 말하면 이벤트 모니터링은 js 엔진이 사용자의 마우스, 키보드, 윈도우 이벤트 및 기타 동작을 모니터링하는 작업, 즉 이벤트를 첨부하는 작업이라고 할 수 있습니다. 일반적으로 사용되는 작업은 btnAdd.onclick=" Alert('51obj.cn')" 과 유사하지만 단순 첨부 이벤트이지만 이 방법은 여러 이벤트 첨부 및 이벤트 삭제를 지원하지 않습니다. 다음 코드는 IE에서 이벤트를 첨부한 후 이벤트 삭제를 구현합니다.
클릭
[Ctrl A 모두 선택 참고:
외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.
]

보기 실행 결과
IE는 표준 DOM 브라우저라고 할 수 없습니다. 심지어 최신 IE8도 Firefox, Opera 등과 같은 표준 DOM에 비해 "이기종"입니다. 실제로 Firefox에만 이벤트 수신 기능이라는 기능이 존재합니다. addEventListener(다음 예 참조)
클릭
[Ctrl A 모두 선택 참고:
외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.
]
보기 실행 효과
www.jb51.net»»
[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다 ]
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

버블링 이벤트를 방지하는 일반적인 방법은 무엇입니까? 버블링 이벤트를 방지하는 일반적인 방법은 무엇입니까? Feb 19, 2024 pm 10:25 PM

버블링 이벤트를 방지하기 위해 일반적으로 사용되는 명령은 무엇입니까? 웹 개발에서 우리는 이벤트 버블링을 처리해야 하는 상황에 자주 직면합니다. 클릭 이벤트와 같은 요소에서 이벤트가 트리거되면 해당 상위 요소도 동일한 이벤트를 트리거합니다. 이러한 이벤트 전달 동작을 이벤트 버블링이라고 합니다. 때때로 우리는 이벤트가 발생하는 것을 방지하여 이벤트가 현재 요소에서만 발생하고 상위 요소로 전달되는 것을 방지하기를 원합니다. 이를 달성하기 위해 버블링 이벤트를 방지하는 몇 가지 일반적인 지시문을 사용할 수 있습니다. event.stopPropa

어떤 이벤트가 버블링될 수 없나요? 어떤 이벤트가 버블링될 수 없나요? Nov 20, 2023 pm 03:00 PM

버블링할 수 없는 이벤트는 다음과 같습니다. 1. 포커스 이벤트, 3. 스크롤 이벤트, 4. 마우스오버 및 마우스아웃 이벤트, 7. 키 누르기 이벤트, 9. DOMContentLoaded 이벤트 10. 이벤트 잘라내기, 복사 및 붙여넣기 등.

버블링 이벤트 지원 안 함: 제한 사항 및 범위 버블링 이벤트 지원 안 함: 제한 사항 및 범위 Jan 13, 2024 pm 12:51 PM

버블링 이벤트(BubblingEvent)는 DOM 트리에서 하위 요소부터 상위 요소까지 단계별로 발생하는 이벤트 전달 방식을 말합니다. 대부분의 경우 버블링 이벤트는 매우 유연하고 확장 가능하지만 이벤트가 버블링을 지원하지 않는 특별한 경우도 있습니다. 1. 버블링을 지원하지 않는 이벤트는 무엇입니까? 대부분의 이벤트는 버블링을 지원하지만 버블링을 지원하지 않는 일부 이벤트도 있습니다. 다음은 버블링을 지원하지 않는 몇 가지 일반적인 이벤트입니다. 포커스 및 흐림 이벤트 로드 및 언로아

버블링 이벤트의 의미는 무엇입니까? 버블링 이벤트의 의미는 무엇입니까? Feb 19, 2024 am 11:53 AM

버블링 이벤트는 웹 개발에서 이벤트가 요소에서 트리거될 때 이벤트가 문서 루트 요소에 도달할 때까지 상위 요소로 전파된다는 것을 의미합니다. 이러한 전파 방식은 마치 버블이 바닥에서 점차 솟아오르는 것과 같아서 버블링 이벤트(Bubbling Event)라고 합니다. 실제 개발에서는 버블링 이벤트가 어떻게 작동하는지 알고 이해하는 것이 이벤트를 올바르게 처리하는 데 매우 중요합니다. 다음에서는 구체적인 코드 예제를 통해 버블링 이벤트의 개념과 사용법을 자세히 소개합니다. 먼저, 상위 요소와 세 개의 하위 요소가 있는 간단한 HTML 페이지를 만듭니다.

버블링 이벤트를 방지하기 위한 지침은 무엇입니까? 버블링 이벤트를 방지하기 위한 지침은 무엇입니까? Nov 21, 2023 pm 04:14 PM

버블링 이벤트를 방지하기 위한 지침에는 stopPropagation(), cancelBubble 속성, event.stopPropagation(), event.cancelBubble 속성, event.stopImmediatePropagation() 등이 포함됩니다. 자세한 소개: 1. stopPropagation()은 이벤트 전파를 중지하는 데 사용되는 가장 일반적으로 사용되는 명령 중 하나입니다. 이벤트가 트리거될 때 이 메서드를 호출하면 이벤트가 계속되는 것을 방지할 수 있습니다.

JavaScript의 공통 이벤트 버블링 메커니즘을 마스터하세요. JavaScript의 공통 이벤트 버블링 메커니즘을 마스터하세요. Feb 19, 2024 pm 04:43 PM

JavaScript의 일반적인 버블링 이벤트: 일반적인 이벤트의 버블링 특성을 익히려면 특정 코드 예제가 필요합니다. 소개: JavaScript에서 이벤트 버블링은 이벤트가 전파될 때까지 가장 깊은 중첩 수준을 가진 요소에서 외부 요소로 전파되는 것을 의미합니다. 가장 바깥쪽 부모 요소입니다. 일반적인 버블링 이벤트를 이해하고 마스터하면 사용자 상호 작용 및 이벤트 처리를 더 잘 처리하는 데 도움이 됩니다. 이 기사에서는 독자가 더 잘 이해할 수 있도록 몇 가지 일반적인 버블링 이벤트를 소개하고 특정 코드 예제를 제공합니다. 1. 클릭 이벤트(클릭

이벤트가 버블링되지 않는 이유는 무엇입니까? 이벤트가 버블링되지 않는 이유는 무엇입니까? Jan 13, 2024 am 08:50 AM

어떤 경우에는 이벤트가 버블링되지 않는 이유는 무엇입니까? 이벤트 버블링은 요소의 이벤트가 트리거될 때 이벤트가 가장 안쪽 요소에서 시작하여 가장 바깥쪽 요소로 전달될 때까지 위쪽으로 전파되는 것을 의미합니다. 그러나 어떤 경우에는 이벤트가 버블링될 수 없습니다. 즉, 이벤트는 트리거된 요소에서만 처리되고 다른 요소에는 전달되지 않습니다. 이 문서에서는 몇 가지 일반적인 상황을 소개하고, 이벤트가 버블링되지 않는 이유를 설명하고, 특정 코드 예제를 제공합니다. 이벤트 캡처 패턴 사용: 이벤트 캡처는 이벤트 버블링과 반대되는 이벤트 전달의 또 다른 방법입니다.

이벤트가 발생하는 것을 효과적으로 방지하는 방법 이벤트가 발생하는 것을 효과적으로 방지하는 방법 Feb 19, 2024 pm 08:25 PM

이벤트 버블링을 효과적으로 방지하려면 특정 코드 예제가 필요합니다. 이벤트 버블링은 요소의 이벤트가 트리거될 때 상위 요소도 동일한 이벤트 트리거를 수신한다는 것을 의미합니다. 이 이벤트 전달 메커니즘은 때때로 웹 개발에 문제를 가져옵니다. 이벤트가 발생하는 것을 효과적으로 중지하는 방법을 배워야 합니다. JavaScript에서는 이벤트 객체의 stopPropagation() 메서드를 사용하여 이벤트 버블링을 중지할 수 있습니다. 이 메서드는 이벤트 핸들러 내에서 호출되어 이벤트가 상위 요소로 전파되는 것을 중지할 수 있습니다.

See all articles